HTML - Tables Misplaced
I'm running IE 7 on Windows XP Home. I'm building a web page with a table, and find the table is mis-positioned, put at the end of the document. I've used tables for years, and this is the first time I've had this problem. This is the code:
<HTML><HEAD><TITLE>Better Endings</TITLE> <META name="description" content=""> <META name="keywords" content=""> <meta name="robots" content="index, follow"> <meta name="revisit-after" content="15 days"> </HEAD> <CENTER><B> <FONT FACE="Arial" size=2> Here You'll Find <FONT FACE="Arial" size=8> <BR>Better Endings <BR><FONT SIZE=3>(or at least <BR><FONT SIZE=5>Alternative Conclusions) <BR><FONT SIZE=3>to these <BR><FONT SIZE=5>Interesting Literary Works<FONT SIZE=3> <P> The Taming of the Shrew To His Coy Mistress <BR>Candide The Tyger <BR>Pride and Prejudice The Love Story of Alfred J. Prufrock <BR>The Old Man and the Sea<P> <FONT SIZE=5>These Better Endings Provided by <BR><FONT SIZE=4>Montgomery Phister</B> <FONT SIZE=3> <BR>Copyright 2005, 2006 by Montgomery Phister, Jr.</CENTER> <P><BR><BR><BR><BR> <TABLE border=0 width="100%"> <TBODY> <CENTER> <CAPTION><FONT face=Arial size=4><B>Table of Contents</B> </CAPTION></CENTER> <TR><TD align=left vAlign=top width="45%"> <FONT FACE=arial> <BR>The Taming of the Shrew <BR>To His Coy Mistress <BR>Candide <BR>The Tyger <BR>Pride and Prejudice <BR>The Love Story of Alfred J. Prufrock <BR>The Old Man and the Sea  </TD> <TD align=left valign=top width=45%><FONT FACE=arial> <BR>William Shakespeare (1564-1616) <BR>Andrew Marvell (1621-1678) <BR>Voltaire (1694-1778) <BR>William Blake (1757-1827) <BR>Jane Austen (1775-1817) <BR>T.S. Eliot (1888-1965) <BR>Earnest Hemingway (1899-1961) </TD> <TD align=left valign=top width=5%><FONT FACE=arial> <BR>3 <BR>13 <BR>15 <BR>20 <BR>22 <BR>35 <BR> 36 </TD></TR></TBODY</TABLE> <FONT FACE=arial SIZE=4> Why is the table below this text? It should preceed it. Only Internet Explorer makes this error. Netscape and Mozilla both have the table above this text. </BODY></HTML> Can you tell me what I'm doing wrong? Similar TutorialsHello, Our twitter feed is misplaced only in Internet Explorer. Works fine in Firefox and chrome. Any ideas on how to fix this? http://www.greekconcierge.com/index2.php many thanks, Andy 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 can someone please tell me how i can do a table with just 1 border line - as when i do it in dreamweaver it always gives me 2 border lines - see below for my code ..thankyou <table width="311" border="1" bordercolor="#990000"> <tr> <td width="301" height="147" colspan="2"> </td> </tr> </table> Is there a way to put together tables so they look like this: Hello everyone. I am trying to make a table based layout for my personal site, and I have run into a problem with my layout images. My issue is this: is there a way you can make the top of a table flush with the top of the page? I want it so there is no gap between the top of my table and the top of the page. I"m wondering how to get that done. I hope someone can help. Hi everybody, I am kind of a newbie and i have a "big" problem which i can't solve. I created some menu tables on the left side of my site, but I cannot seem to align them to the top of the table and they keep moving to the middle. On one version of this site i "pushed" them upwards with another 100% height invisible table from the bottom but it doesnt seem to work on an other version. Please help me! How could I align the tables to the top inside of another table? Thanks a lot for your help! If I was hardly understandable I'm sorry, I created a little example table: <table height=400 width=600 border=3 bordercolor=#000000><tr> <td width=20% border=3 bordercolor=#000000><table> <td border=3 bordercolor=#000000 align=center><table><tr><td><table border=1 bordercolor=#000000><tr><td><table align=center><tr><td> Menu 1</td></tr></table></td></tr><tr><td><table><tr><td></td><td> <a href="">Button 1</a></td></tr></table></td></tr><tr><td><table> <tr><td></td><td><a href="">Button 2</a></td></tr></table></td></tr> </table></td></tr></table><table><tr><td><table border=1 bordercolor=#000000><tr><td><table align=center><tr><td>Menu 2</td> </tr></table></td></tr><tr><td><table><tr><td> </td><td><a href="">Button 1</a></td></tr></table></td> </tr><tr><td><table><tr><td></td><td> <a href="">Button 2</a></td></tr></table></td></tr></table></td></tr> </table></td> </table></td> <td width=80% border=3 bordercolor=#000000 valign=top align=center>How could I "stick" the menu tables on the left side to the top, like this text on the right side with valign=top? </td></tr><table> We have the following code in our header at www.hometheatershack.com ... but I'm thinking it ain't right and am wondering if someone could look at it and tell me if I can improve on the code. Code: <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center"> <tr> <td rowspan="4" width="30%" align="left"><a href="/"><img src="/images/htslogo20.gif" border="0" alt="Home Theater Shack" /></a></td> <td rowspan="4" width="40%"></td> <tr> <td width="10" align="right" valign="bottom"> <!-- SVS Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=adf57b41&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=3&cb=$includedphp;&n=adf57b41' border='0' width='192' height='54' alt='SVSound' /></a> <!-- End SVS Banner --> </td> <td> </td> <td width="10" align="right" valign="bottom"> <!-- GIK Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=a21b1e29&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=6&cb=$includedphp&n=a21b1e29' border='0' width='192' height='54' alt='GIK Acoustics' /></a> <!-- End GIK Banner --> </td> <td> </td> <td width="10" align="right" valign="bottom"> <!-- Ultimate Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=ac45af25&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=7&cb=$includedphp&n=ac45af25' border='0' width='192' height='54' alt='Ultimate Home Entertainment' /></a> <!-- End Ultimate Banner --> </td> <td> </td> </tr> <tr> <td width="10" align="right" valign="top"> <!-- Fi Audio Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=a7b0e02e&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=9&cb=$includedphp&n=a7b0e02e' border='0' alt='Fi Audio' /></a> <!-- End Fi Audio Banner --> </td> <td> </td> <td width="10" align="right" valign="top"> <!-- SoundSplinter Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=acf07dac&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=8&cb=$includedphp&n=acf07dac' border='0' alt='SoundSplinter' /></a> <!-- End SoundSplinter Banner --> </td> <td> </td> <td width="10" align="right" valign="top"> <!-- Discount Merchant Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=a11ec3d3&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=10&cb=$includedphp&n=a11ec3d3' border='0' alt='Discount Merchant' /></a> <!-- End Discount Merchant Banner --> <br /><br /> </td> <td> </td> </tr> </table> Thanks! Sonnie I've been having some issues with my site. It looks fine in IE but it doesn't look correct in Firefox, Opera and Safari. The tables are misaligned and I am at a total loss. Can anyone help me out. Thanks here is the link; http://wwwdotcapleeconsultingdot.com i have tables.. http://teamsquirrels.net when one expands it goes under or over the other i want it to push the other one across how can i do this??? Hey, i'm trying to make a simple site, and right now i have one page with a table centered. That all works good, and when you change the size of your webpage, the table always stays centered. My problem is i would like to do this with DIV, because CSS allows more positing control. Yet, when i put a DIV table somewhere when i change the size of my webbrowser the table just disapears off to the site instead of staying centered (even thou its not set to stay centered) I geuss a better question would be how can i control where the table is, but keep it relitive to the size of the window? With CSS or with HTML. Thanks. hey everyone, pretty simple question i am supposing, how do i stop the text in my tables from wrapping to fill the space inside the cell. The text in each cell flows over into a second line, and I end up getting writing that has huge spaces between each word, to try and fill out the line. I still want two lines, just normal sized spaces between words if that makes sense... I have a table I created and I want to have a page that allows you to fill in text boxes to answer questions and then when submitted it will put the answers in the correct cell of the table. I have no idea how to do this and am limited in my html skill. If some one could point me in the right direction I would appreciate it greatly. http://www.roleplayingmaps.net/sheet.htm This is the table I have already created. Thanks for taking the time to read. I'm starting a forum here, and I really want to get it up soon. But I can't because I'm having trouble w/ the header. On the header there's supposed to be text on top of it, but it's not. It's on the side. Can anyone help? Thank you. Here's the code:
Code: <a name="top"></a> <table cellspacing="0" cellpadding="0" border="0" width="696px" align="center"> <tr> <td bgcolor="#ddeef7"> <table border="0" cellspacing="1px" cellpadding="6" width="100%"> <tr> <td width="74%" bgcolor="#ffffff"> <table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr> <td valign="top" rowspan="2"><a href="index.php"><img src="./images/oxygen/logo.png" alt="Ne-YoFan.com Online Community" border="0" /></a></td></tr> <tr> <td align="right" valign="top"><font class="smalltxt">Last active: 14-6-2008 at 08:10 PM<br /></font></td> </tr> <tr> <td align="right" valign="bottom"><font class="smalltxt">Logged in as <a href="member.php?action=viewpro&member=Erika">Erika</a><br />[<a href="misc.php?action=logout">Logout</a> - <a href="u2u.php" onclick="Popup(this.href, 'Window', 700, 450); return false;">U2U</a> - <a href="memcp.php">User Control Panel</a> - <a href="cp.php">Administration Panel</a>]</font></td> </tr> </table> Ok I'm trying to get a page to look like this I did it with images, so theres no text. So there's 4 images basically I tried to do a table like this Quote: <table border="0"> <tr> <td><a href="http://milkshakekicks.com/kicks/index.php?main_page=product_info&cPath=1&products_id=10&zenid=c1961df3cad20f9854cb47801f 85ee4d"><img src="http://milkshakekicks.com/blog/wp-content/uploads/2009/01/picture-1.png" alt="" /></a></td> <td><img src="http://milkshakekicks.com/blog/wp-content/uploads/2009/01/picture-2.png" alt="" />, <img src="http://milkshakekicks.com/blog/wp-content/uploads/2009/01/picture-3.png" alt="" />, <a href="http://milkshakekicks.com/kicks/index.php?main_page=product_info&cPath=1&products_id=10 amp;zenid=c1961df3cad20f9854cb47801f85ee4d"><img style="border: 1px solid grey;" src="http://milkshakekicks.com/blog/wp-content/uploads/2009/01/battle_homepage.png" alt="" width="209" height="179" /></a></td> </tr> </table> but got this Should I not do this with tables? Back in 2004, i created a site, with tables. Have no idea how I did it, someone must have helped me. I want to update that site and make the center section wider than the sides (the sides can be of equial width). The URL is http://www.ilovejesus.com/lot/awesomebks/news.shtml Can someonehelp me with this? I need the code from the beginning of the table to the end of that column, that is Column 1, (left side) back to top for Column 2 (center), back to top for Column 3 (right side) and to the bottom of that column. I would like the center column to be at least 2x as wide as the side columns. Tell me how to end the tables and begin the text which will be straight across page. Thanks. Is there anyway that in Internet Explorer I can stop it auto-resizing? I think that is the problem I'm having, I'm not sure though. The problem is this: http://i37.photobucket.com/albums/e8...66/problem.png The cell on IE adds onto the top and bottom of the image for seemingly no reason. The image on the broken cell is a link as well. I tried making the image the background of the cell and having a transparent image as the link over the top but it brings up the same problems. There's no border around the image and no cell padding. The code used for that specific cell is: Code: <TD height="74" style="background-repeat:no-repeat;" COLSPAN=2><a href="MYLINK" target="_blank"><img src="http://i37.photobucket.com/albums/e85/pxi666/seashell/seashell_layout_09.png" width="411" height="74" border="0"></a></TD> Any ideas on what could be causing this? Thanks a lot in advance, Ollie Can someone give me a tutorial on tables please? I would very much apprieciate it. I don't really know anything on tables so please start basic. I hope to see a response soon. I have a L shaped image that I want to put into a table as a whole rather than cut into to two oblongs. As I am not an expert I wondered if this would mean that the space surronding the L shapped image will not be accesble when place in the table.. I want to put txt into the recess against the right angle formed by the L I think that the <td><img src="Lshape"/></td > way that the table structure works that the L will have a rectangle around it and that this will prevent things butting close to it.. is there a way around it.. Apart from cutting the L shape into two pieces and putting a table within a table thanks Larry When i make a table, it will goto the next line, for example if i want an image on the left of my table, the image will go first, and thenthe table will automatically be displayed on the next line. Is there any way i can fix this is CSS, HTML, Javascript, anything? If you need more info on my problem i could take a print screenn... Cheers! Here's an example - I want the images to be at either side of the table, so theres no space... |