HTML - Vertical Allignment
I need to align an image so it is in the dead center of my frame. This is because when the window is resized, the menu and header change size and go out of wack. I tried putting the image in a table, but i cant get anything to work. We arent allowed to use any CSS for the assignment, only pure HTML. The following is my code for my header:
<html> <body background="images/backgrounds/header.png"> <table border="0" align="center" valign="center"> <tr> <td><img src="images/banner2.png"></td> </tr> </table> </body> </html> Thanks in advance... Similar TutorialsMy Site Please check out the site above, which I am currently working on. The problem I am having is the left hand menu looks alright on the first page but shrinks if you go on the driving school page Cant work out why? Please Help my website alligns left when i view it in a widescreen monitor.....i want allign it in the center when viewed in widescreen......please help Hello, I am currently creating several webpages for a school project. I would like to place four images at the corner of the browser window. How could I allow the four images to be in the absolute corners (without interfering with anything else on the page)? Thank you, JRosselet Hi guys I have a couple pages but im currently working on one html file with an external css file. I have a <h3>January</h3> in my html, with the css being Code: h3 { background-color:#ccaa66; color:#000000; font-family: Veranda, Arial, sans-serif; padding-left:10px; } underneath the <h3> heading in my html file i then have Code: <div id="content"> <p> Melanie Morris entertains<br/> with her melodic folk style,<br/> Check out the podcast! <br/>CDs are now available</p> </div> with the css being Code: #content { position: relative; left:150px; font-family:Arial,sans-serif; } Now the problem i have is i want to insert a image next to the paragraph, if i insert the image into the html within the paragraph code which is within the div=content it overlaps the footer down below and it just doesnt sit right Similar problem to fender967, my website: http://www.freewebs.com/microbitztest/ looks fine in IE but not in firefox??? Whats that all about? I have had a look at this previous thread - but i still have an unwanted and unnecessary vertical scrollbar when using IE7. Can anyone help me get rid of it - please Even with a no-brain - one line page the scrollbar is displayed Heres my page Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Title Page</title> </head> <body style="overflow:hidden"> <p>One line of text</p> </body> </html> I've had a browse through the forums and done a bit of googling - but I haven't found a solution I am having trouble aligning input fields to the bottom of the cell. Here is the link: It looks correct in Firefox, but not in Internet Explorer. Please compare the link in both browsers. http://www.sandmanmedia.net/draft/chrisbaran.html I get this error message when trying to validate my page in 4.01 transitional. What html code can I use to get a vertical alignment with my tables. Error Line 18, column 79: there is no attribute "VALIGN" . ... cellspacing=10 align="center" valign="top"> Thanks Is there a way to align something in the dead centre of the page? here is my code so far. Code: <html> <head> <title>website</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="stylesheet.css" rel="stylesheet" type="text/css"> <style type="text/css"> body { background-color: #BFE4FF; } </style></head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table width="801" height="600" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01"> <tr> <td rowspan="2"> <img src="images/logo_01.jpg" width="136" height="117" alt=""></td> <td rowspan="9"> <img src="images/spacer_03.jpg" width="30" height="600" alt=""></td> <td> <img src="images/spacer_04.jpg" width="611" height="20" alt=""></td> <td rowspan="9"> <img src="images/spacer_04-05.jpg" width="23" height="600" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="20" alt=""></td> </tr> <tr> <td rowspan="7"><iframe name="iframe1" src="home.html" width=611 height=557 marginwidth=0 marginheight=0 frameborder=0 scrolling=auto></iframe></td> <td> <img src="images/spacer.gif" width="1" height="97" alt=""></td> </tr> <tr> <td> <img src="images/spacer_01.jpg" width="136" height="43" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="43" alt=""></td> </tr> <tr> <td> <a href="home.html" target="iframe1"><img src="images/button_home.jpg" width="136" height="46" alt=""></a></td> <td> <img src="images/spacer.gif" width="1" height="46" alt=""></td> </tr> <tr> <td> <a href="srchpat.html" target="iframe1"><img src="images/button_srchpat.jpg" width="136" height="47" alt=""></a></td> <td> <img src="images/spacer.gif" width="1" height="47" alt=""></td> </tr> <tr> <td> <a href="newpat.html" target="iframe1"><img src="images/button_newpat.jpg" width="136" height="48" alt=""></a></td> <td> <img src="images/spacer.gif" width="1" height="48" alt=""></td> </tr> <tr> <td> <a href="help.html" target="iframe1"><img src="images/button_help.jpg" width="136" height="47" alt=""></a></td> <td> <img src="images/spacer.gif" width="1" height="47" alt=""></td> </tr> <tr> <td rowspan="2"> <img src="images/spacer_2.jpg" width="136" height="252" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="229" alt=""></td> </tr> <tr> <td> <img src="images/spacer_05.jpg" width="611" height="23" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="23" alt=""></td> </tr> </table> </body> </html> I have managed to centre the page horizontally but i would like to also have the page vertically centred Thanks hello, maybe this can not be done but..... i have managed to align the text on the lft and on the right in the same cell but, the text will not align to the top of the cell it seems that the use of the <p> in the line is preventing the text from sitting at the top of the cell can anyone help me with this? can i achive the same thing a different way? one cell, same line, text left and text right both at the top of the cell thanks sophia here is the example code..... http://www.freewebs.com/forumcode/ here is the code (note: everything is inline at this stage) <html> <head> <title> left and right but billy space on top >.< </title> </head> <body bgcolor="#FFFFFF"> <center> <table width="200" bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="5"> <tr> <td style="text-align: center;" bgcolor="#DDDFFF" height="125" width="125"> <img src="image.jpg" border="0" alt="image" height="85" width="125"> </td> <td valign="top" bgcolor="#DDDFFF"> NOTE: this valign does nto set the text to the top <div style="width:200px;"> <p style="width:100px;float:left;text-align:left;vertical-align:top;">Left</p> <p style="width:100px;float:left;text-align:right;vertical-align:top;">Right</p> <div align="justify">this text sits underneath the above text<br>this text sits below the above text</div> </div> </td> </tr> </table> </center> </body> </html> Hi All, I've been trying to vertically align the span inside the div, but I have no idea why it's not working. Any clues? HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Untitled Page</title> </head> <body onload="init()"> <div style="background-color: gray; width: 100%; height: 40px; text-align:right; vertical-align:middle"> <span style="background-color: #CCCCCC; font-size: 9pt">Settings</span> </div> </body> </html> Hello can anybody help my with html about a vertical line with wat codeyo can make a vertical line for your website in html. Erwin Is there an easy way to make a vertical line? For example, some equivalent to <HR> ? Thank you. I have a vertical scrollbar in green colors and it can be viewed in IE 7 but when I look page in Firefox 3.0.15 it can not be viewed in green colors. page: http://www.astrosport07.webs.com/ Can I do something that scrollbar to appear in green colors in "all" brawsers? have some html code which is putting some image buttons into a menu which goes across the top of the page. I want to change this too make them go down the page. I have a css file with the code that looks like this Code: Code: #nav_menu { /* background: transparent; */ background: #ddd; border: #dcdce9 solid thin; /* margin: 10em; */ position:absolute; top: 70px; left: 0px; padding: 0pt; right:0px; height: 51px; /* bottom:200px; */ } and the html code looks like this Code: Code: <ul id="globalnav"> <li><a href="index.php?here=home" class="" id="home">Home</a></li> <li><a href="index.php?here=daybook" id="daybook" class="">Day Book</a></li> <li><a href="index.php?here=wms" id="wms" class="">Work Management System</a> <ul> <li><a href="index.php?here=staff" id="staff" class="">Staff</a></li> <li><a href="index.php?here=shifts" id="shifts" class="">Work shifts</a></li> </ul> what part do i need to change to make it go vertically? <div align="center"> <table height="117" cellspacing="0" cellpadding="0" border="0" class="btn1 boxbtn1"> <tr> <td> <a href="images/gymfu.png" rel="lightbox[roadtrip]" title="Gym Fu - Branding">image #1</a></td> </tr> </table> </div> ----- I've tried 'valign="middle" ' in the html code, and also 'vertical-align:center' in the css. no joy. Can anyone help? Hi Comparing this code <div style="border:1px solid black; width:120px;height:25px; padding-top:0px;">hello</div> in Internet Explorer 9 and FireFox 4 shows, that the word 'hello' is not at the same vertical position. Is there a method, to adjust this? Thanks for your information. Patrick Hey guys! I seriously need your help!! I have searched everywhere and tried everything, but can't seem to get this to work. Basically I have a DIV tag with one line of text in it. The text needs to be in the middle of the DIV, vertical and horizontal. Now, it looks fine, except in IE, which makes me sad. Does anyone know a way to fix this? You can see the site here (please don't judge me, its not finished!) http://www.juicenothing.com/index.php It's the Lady Gaga text in the header part. Thanks! Jared I would like to have vertical scrolling in a table cell. The cell may be empty or may contain up to 2000 characters. If it does contain more than will fit in the horizontal space I'd like it to wrap and be visible, pushing the next row down so the cell displays the whole set of text within the cell area. Only then should the scrollbar show up. If the user enters data, I'd like it to do the same thing. Wrap on word boundaries and stay visible rather than scrolling a single line horizontally. Can I do this in html? Or, at worst, with a little CSS? Or, even worse, very simple javascript? Trying to get my main content to centre in the middle of the page (vertically). Having problems... Can move the content from the top (with margin) but cannot work out how to get the whole thing to constantly float in the middle /centre. Any help hugely appreciated. thx |