HTML - Where Am I Going Wrong? (tables)
im very confused, Firefox runs the site perfectly, exactly how i'd expect. In safari nothing shows up and in I.E 6 the page screws up depending on how long it takes for the page to load .
this is firefox - and that is exactly what you get if you open IE and go to the page first time round, but if you then went to another page and took a link back to the original page, this happensbut it then fixes it self if you reload using F5 but not by reloading the page with the address bar. . What looks to be happening is IE is forgetting to format the text and it's resizing the boxes around it to fit rather than re ordering the text - In safari it's just blank. anyway all the page layouts are put there using php to make it easy to fix problems like this, so on that page you see this sorta thing. how the layout works is it starts with this - 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" style="height: 100%;"> <head> <title>Technology</title> <meta http-equiv='Content-Type' content='text/html; charset=utf-8' /> <title>D-Wave Systems</title> <script type='text/javascript' src='js/mootools.js'></script> <script type='text/javascript' src='js/slimbox.js'></script> <link rel='stylesheet' href='css/slimbox.css' type='text/css' media='screen' /> <link rel='stylesheet' href='css/Main.css' type='text/css' media='screen' /> <script src='Scripts/AC_RunActiveContent.js' type='text/javascript'></script></head> <body style="height:100%;"> <div id='MainContainer'><table border=0 cellspacing=0 cellpadding=0 class=Container height=100%> <tr><td width=38px height=100% background=images/leftPB.png> </td> <td bgcolor=#FFFFFF valign=top width=700px> 'MainContainer' looks like this - Code: width:800px; /* total width of left+right+center */ height: 100%; margin: 0 auto; inside <td bgcolor=#FFFFFF valign=top width=700px> you have the title bar and to organize the Headlines and main content there's another table - HTML Code: <table width='713' height=400 border='0' cellpadding='0' cellspacing='0'> <tr><td width='470' valign='top' style='background:url(images/contentBgTop.png); background-repeat:no-repeat; background-position:center; height:20px;'> </td> <td width='237' id='HeadLines' valign='top' rowspan=3> ## THIS IS INSIDE THE HEADLINES BOX ## </td> </tr> <tr> <td style='background:url(images/contentBgMiddle.png); background-repeat:repeat-y; background-position:center; text-align:left;' valign='top'> ## THIS IS INSIDE THE CONTENT BOX ## </td> </tr> <tr> <td style='background:url(images/contentBgBottem.png); background-repeat:no-repeat; background-position:center; height:20px;'> </td> </tr> </table><table height=100><tr><td>hello</td></tr></table> </td> <td background=images/rightPB.png height=100% width=38px> </td> </tr> <tr> <td style='background:url(images/bottemLeft.png); background-repeat:no-repeat; background-position:center; height:46px;'></td> <td style='background:url(images/bottem.png); background-repeat:no-repeat; background-position:center; height:46px;'></td> <td style='background:url(images/bottemRight.png); background-repeat:no-repeat; background-position:center; height:46px;'></td> </tr> </table></div></body> </html> Where am i going wrong :S should i be trying a different method to organize the elements? Thanks for reading, sorry it's a little lengthy Similar TutorialsWhile I was searching for an HTML forum to join, I came across a statement in another forum that said using tables to layout a web page is incorrect -- even stupid. Is this true? I have been reading a book entitled "HTML, XHTML, and CSS Bible" which devotes an entire chapter (chapter 11) to "Page Layout with Tables" and continually refers to page layout within Tables and Nested Tables. This is the method that I have been using to create my first web pages. Do I need to re-think this and change the way I layout my pages? Please enlighten me... Thanks, JFB Hello, I'm designing a site that has a table with it's cells containing unordered lists. These lists are working and displaying fine, except for when I use IE. The links automatically drop down to the next line no matter what. FF looks perfect. Example: Code: <td width="367" height="165" nowrap="nowrap" background="Assets/GFX.png"> <ul> <li><strong>Full name</strong> Name<a name="Name" /></li> <li><strong>Birth date</strong> January 19, 1980 </li> <li><strong>Birthplace</strong> Frome, Great Britain</li> <li><strong>Link</strong><a href="http://website.com" class="linkcolor" > Website </a></li> </ul> </td> The part in red is the issue. in IE, the Website part drops down to the next line, even though there is plenty of space in the cell. Is there a trick to fixing this? Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts I'm changing from HTML 4.01 to XHTML 1.0 Transitional now, but what are my errors here exactly? http://validator.w3.org/check?uri=ht...andersmj.dk%2F EDIT: Looks like there's only one error now, but please allow me to ask again if solving this one causes new ones. Hey Guys I am trying to find the correct spot in the following link to add the no follow tag I tried as it is but my software on my site tells me its still do follow any help appreciated http://www.amazon.com/gp/product/B003VQQVDU/ref=as_li_ss_tl?ie=UTF8&tag=facdirjewclu-20&linkCode=as2&camp=217145&creative=399349&creativeASIN=B003VQQVDU" rel="nofollow">VIZIO M221NV 22-Inch Full HD 1080P LED LCD TV with VIA Internet Application, Black</a><img src="http://www.assoc-amazon.com/e/ir?t=&l=as2&o=1&a=B003VQQVDU&camp=217145&creative=399349" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /> Could you highlight where I have to put the no follow tag and if there needs to be a space like there is above thanks Hi All, I was hoping to start a site from scratch and muddle my through any issues that came up. I came across this article about how to auto size the background image and thought that it would give me a perfect start as I could get a nice background that would auto resize. http://css-tricks.com/perfect-full-p...kground-image/ I dunno what I am doing wrong but the background image never displays. Is anyone able to create me some test files that I can simply dump on my server and see if it works. Sounds silly i know but I cannot get the image to display and I am not sure why! Thanks If I type this URL into my browser location bar, it works just fine, and displays the image properly: http://www.zappos.com/n/multi_view.c...223&view=multi If I use the same URL in the following code on an html page and render it in the browser, no image displays: <img src="http://www.zappos.com/n/multi_view.cgi?product_id=7558977&color_id=205223&view=multi"> What am I doing wrong? I've tried encoding it, but that didn't fix the problem. Can someone please help? I'm sure I'm missing something completely obvious. Thanks, Janet Ok, so I was using dream weaver to make a website for a school assignment. Everything was ok until I previewed the page in my browser and everything thing was way of context the table was stretched a lot more than it should have been, but everything looked perfect in design view in dreamweaver. I understand that the browser is going to be larger and the screen resolution will be away out, but I'm not sure how to fix it, what do I need to change to get a good layout. Thanks. Here is the code. Code: <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body marginwidth="0" marginheight="0" leftmargin="0" topmargin="0" bgcolor="#FFFFFF"> <table width="72%" border="0" cellspacing="0" cellpadding="4"> <tr> <td rowspan="2" bgcolor="#666666"> </td> <td width="50%" height="141" bgcolor="#000099"><div align="center"><img src="mm/stationery/CatalogB/golf ballistics.jpg" width="700" height="200"></div></td> </tr> <tr> <td height="97" align="center"><table width="72%" height="35" border="0" cellpadding="4" cellspacing="4"> <tr bgcolor="#CCCCCC"> <td bgcolor="CCCCCC"> <div align="left"><strong><font face="Tahoma"> </font></strong> <div align="center"> <div align="center"> <pre> <strong><font color="#339966" face="Tahoma"> </font></strong></pre> <pre><strong><font color="#339966" size="3" face="Tahoma"><a href="www.example.com">Home Online shopping forum Equipment </a> </font></strong></pre> </div> </div> </div></td> </tr> </table> </td> </tr> </table> <table width="399" height="612" border="0" align="center" cellpadding="4" cellspacing="0"> <tr valign="TOP"> <td width="19%" rowspan="2" valign="top" bgcolor="CCCCCC"> <p align="center"><font face="Tahoma">Harrington Tops Woods</font><br> <br> <img src="woodsharrington111906_400.jpg" width="195" height="201"></p> <p align="center"><nobr><font face="Times New Roman, Times, serif">: <ABBREV>Padraig Harrington made a dramatic late comeback to catch Tiger Woods, then beat the world's No. 1 player on the second playoff hole Sunday to win the Dunlop Phoenix tournament in Japan. Both players birdied the 72nd ho to shoot 67 and finish at 9-under-par 271: </ABBREV></font></nobr></p></td> <td width="38%" height="336" bgcolor="#CCCCCC"> <img src="tshirt.jpg" width="133" height="164"><br> <p><nobr><strike>Was £39.99</strike></nobr></p> <p>Now £15.99<nobr></nobr></p> <p><nobr><a href="#">Add to Cart</a></nobr></p></td> <td width="43%" bgcolor="CCCCCC"> <p><img src="DWTM110L.jpg" width="154" height="152"></p> <p><strike>Was: £299.99</strike> <br> </p> <p>Now: £99.99 <br> </p> <nobr><a href="#">Add to Cart</a></nobr></td> </tr> <tr valign="TOP"> <td bgcolor="CCCCCC"> <p><img src="nw.jpg" width="135" height="148"></p> <p><strike>Was: £199.99</strike> <br> Now: £99.99 </p> <p><a href="#">Add to Cart</a></p></td> <td bgcolor="CCCCCC"> <p><img src="cl.jpg" width="151" height="149"></p> <p><strike>Was: £149.99</strike><br> Now: £129.99 <br> </p> <p> <nobr><a href="#">Add to Cart</a></nobr></p></td> </tr> </table> <table width="92%" border="0" cellspacing="0" cellpadding="4"> <tr> <td width="0%" align="center" valign="top" bgcolor="#000099"> </td> <td width="100%" valign="top"> <p> </p> <table width="90%" border="0" cellspacing="4" cellpadding="4" align="center"> <tr bgcolor="BottomNavigationColor"> <pre><td> <a href="www.example.com"><align="center"> Contact us | Terms and conditions | Help </a></td></pre> </tr> </table></td> </tr> </table> <table width="92%" border="0" cellspacing="0" cellpadding="4" bgcolor="#999999"> <tr align="right"> <td bordercolor="#999999" bgcolor="#CCCCCC"><em><a href="www.example.com"><strong>Back to top</strong></a></em></td> </tr> </table> </body> </html> O.K, I'm building my new website and using smart FTP client to upload my files. Please take a look at the website I'm building, how come it is like this? www.hautecoutureforkids.com When I click the .html buttons it works, but I don't want it like that. I want when I type in my website's name, the page appears automatically. I hope my explaination is not confusing. Please help Thank you in advance Ning Hello. I need to know what i'm doing wrong in this code. Code: <html> <title>CoAlliance</title> <head><img src="banner.jpg"></head> <body> <table border="0" style="float: left;"> <tr><td><img src="button1.jpg"></td></tr> I added a banner, and when I add a picture for a button, I can't see it. Help me please. Hi all, I am quite new to HTML and i'm not too sure what I have done wrong. On one of my website pages I wanted to display 4 pictures in a grid of 2 by 2, this works fine but the text does not sit right. It is going up the middle of the pictures. How do I get it so that the text stays below the pictures and not going in between them? My website is www.flobbadobba.co.uk and the page I am having this issue with is the jigsaw puzzle page (www.flobbadobba.co.uk/puzzles.html) at the moment it is just this page that I am having the issue with but I'm sure I will get the issue on other pages later as I plan to do some similar layouts. Any help will be great. Simon Whats wrong with this code its not comming up when i try it HTML Code: <html> <head> <title> Buzz OFF!!! </title> <script language="JavaScript"> <!- Hide from older browsers alert("Press ok to start reformatting your hard disk"); // end hiding -> </script> </head> </html> found the problem. I have this line of PHP that keeps getting an error message about an unexpected "=" sign. if ($prevPage > $chapters[$chapter][0]) $out .= "<a href="/book.php?chapter={$chapter}&page={$prevPage}">Prev</a>"; As best I can figure it out the offending "=" is that one in "....?chapter={$chapter..." Can anyone tell me how to fix this, please? Hi guys, new to the forum. Trying to put together a portfolio site: http://www.studioeighty.co.uk/portfolio/ I'm using a program called Coda-Slider which is JavaScript but for some reason only one of the arrows is showing. Any ideas where I've gone wrong? thanks in advance. studioeighty Hello everyone I am very new to this so be kind! Why can I only see code on this page and what do I do to put it right? http://www.test.q-p-e.co.uk/jobby.html Hello! I'm completely self taught and sometimes I get things wrong. I'm having problems with the html. The site looks bigger and some of the sizes (scroll bar) aren't right in Internet Explorer - I was wondering if anyone could tell me what the problem is or even suggest another way to work it out.. Here's the link: http://www.shortdoggkennels.com/brooklynsedge/home.html And here's a direct link to the CSS: http://www.shortdoggkennels.com/brooklynsedge/style.css Thanks in advance! Hello I'm new here.I thought maybe you guys can offer me some help by taking a look at my code for my client side html map.I'm a bit of a noob, and self taught as well.i'm pretty sure i grabbed this code from the htmlforums tutorial. I'm using tripod to make my site. My image map is suppose to take up the whole page. Firstly, the whole picture itself shows up as a linkable image with no separate link areas, secondly, theres a hideous blue border around it.Could anyone of you take a look? It would be much appreciated. This is the html for the whole document located in my file manager. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!-- \/ starthtml --> <html> <head> <!-- The block of META tags is required by Homepage Studio --> <!-- to identify this file as created by Freeform Editor. --> <!-- Please do not remove them, but feel free to append --> <!-- them with your personal data below. Meta tags help --> <!-- search engines identify the content of your page. --> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> <META NAME="keywords" CONTENT="enter keywords here"> <META NAME="description" CONTENT="enter a description here"> <META NAME="author" CONTENT="enter your name here"> <META NAME="generator" CONTENT="FreeFormEditor 1.0"> <TITLE></TITLE> </head> <body> <body bgcolor="#FFFFFF" text="#000000" link="#0000EE" vlink="#551A8B"> <MAP> <A HREF="lyndlsimagemap3.jpg"> <IMG SRC="lyndlsimagemap3.jpg" HEIGHT="800" WIDTH="800" ISMAP USEMAP="#lyndlsimagemap3"></A> <map NAME="#Lyndlsimagemap3"> <area SHAPE=RECT COORDS="68,460,164,480" HREF="page1.html" ALT="page1"> <area SHAPE=RECT COORDS="25,72, 28,97" HREF="http://www.google.com" ALT="google"> <area SHAPE=RECT COORDS="107,158, 132,162" HREF="http://google" ALT="google"> <area SHAPE=RECT COORDS="9,115 86,79 98,116 69,131 86,175 48,206" HREF="http://google.com" ALT="google"> </MAP> </body> </html> <!-- /\ end html --> Thank you so much |