HTML - Tables, I Think It's An Ie Issue...
I designed a website in Photoshop/Dreamweaver CS3 and everything looks GREAT on my Mac (on Firefox, Safari and IE 5.2.3). But my client, who is on a PC, sees something completely different. Obviously, what he sees is more important than what I see.......
What I see: http://farm4.static.flickr.com/3183/...62a4ff.jpg?v=0 What he sees: http://farm2.static.flickr.com/1154/...a24335.jpg?v=0 The website is http://valleychurchidaho.com, with these screenshots from this page. It seems to be an issue both with the iframes I've used and the tables. How do I force it to be 800 px wide and no more? Since I can't reproduce his issue to troubleshoot, I'm really working in the dark here. Any help/advice would be appreciated. Similar TutorialsIm using the following doctype <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> Without this doctype my header menu does not work. However when I include it I get a display error in IE 6 and 7 and opera, Mozilla displays fine. I have the main page in a table with two rows. inside each row I have a nested table each with 2 table cells (making a simple 2 x 2 table). I then render my content inside each cell with a table itself. Every table is set to 100% in height however the internal tables only render to the browser with the height of the content so the content does not line by filling out the full table cell area. I realise this is not a great deal of info but I don't have access to image editing software to show you atm. I just wondered if you could give me any ideas as to why this might happen. so far I've checked: for any open tags. all okay none found for any table or td references in the style sheets. all okay, all accounted for in seperate classes closed with clear divs tried to align to the top. works but does not fix the height Ive tried inline styles to set the internal table height to 100%. Does not have any effect. I've even tried over riding the tables with seperate classes in css. I can set the table background to a color to show that it does indeed act on the table but setting height to 100% has zero effect to the internal table height. really baffled and confused and err...annoyed any ideas appreciated and welcome. Thanks in advance How can I make textbox in cell[2,2] get its right border displayed and aligned with upper cell??? <table style="padding-right: 20px" cellspacing="0" cellpadding="0" width="1000px"> <tr> <td width="25%"> <span id="Label9">label</span><br /> <input name="TextBox10" type="text" id="TextBox10" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td width="25%"> <span id="Label10">label</span><br /> <input name="TextBox11" type="text" id="TextBox11" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td width="25%"> <span id="Label11">label</span><br /> <input name="TextBox12" type="text" id="TextBox12" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td width="25%"> <span id="Label12">label</span><br /> <input name="TextBox13" type="text" id="TextBox13" style="border-width:1px;border-style:solid;width:100%;" /> </td> </tr> <tr> <td> <table cellspacing="0" cellpadding="0" style="width: 100%"> <tr> <td style="padding-right: 15px" width="50%"> <span id="Label18" style="display:inline-block;width:100%;vertical-align: top; text-align: left">label</span><br /> <input name="TextBox19" type="text" id="TextBox19" style="border-width:1px;border-style:solid;width:100%;" /></td> <td align="right" width="50%" > <span id="Label19" style="display:inline-block;width:100%;vertical-align: top; text-align: left">label</span><br /> <input name="TextBox20" type="text" id="TextBox20" style="border-width:1px;border-style:solid;width:100%;" /></td> </tr> </table> </td> <td> <span id="Label20">label</span><br /> <input name="TextBox21" type="text" id="TextBox21" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td colspan="2"> <span id="Label21">label</span><br /> <input name="TextBox22" type="text" id="TextBox22" style="border-width:1px;border-style:solid;width:100%;" /> </td> </tr> </table> I am very new to CSS have only done basic html coding before. I have been messing with my ebay page and their code trying to get mine to look similar to theirs and learn a bit in the process. however I've run into a snag, Im trying to use a duel column format but the column on the right isn't maintaining its borders. its expanding off screen to fit the text rather than containing it and expanding downward. I also can't get the left column lvl with the right. I've messed with all the values I could find but have had no luck fixing the problem. I realize there is a tremendous about of extra code that I need to remove but If anyone could give me a hand I would very much appriceate it. Many thanks in advance Using AJAX & php to return a randomly generated number of single column tables, and drop them into a <div> element. ( http://www.thegreatmartinicompany.co...ace-value.html ). I've set the div to text-align: center, and put auto margins on the tables. The result is the tables are centered and equally spaced in the div element regardless of the number of tables returned. As appropriate FF and IE display the tables side by side, but Safari stacks them on top of each other. An example of the returned code is below. Any ideas why Safari does not display this as IE and FF do? <table style="margin-left:auto; margin-right:auto"><tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </table> <table style="margin-left:auto; margin-right:auto"><tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </table> <table style="margin-left:auto; margin-right:auto"><tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </table> 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 have my table all finished and everything.. it looks nice, except the fact that my words.. some of them are cut off. anyone know how to fix this? I have tried making my table smaller in width than my "div", but that still doesn't work. If you could please help me I would greatly appreciate it, and I would like to thank you in advance. 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. Hello everyone. Im making a website for my company and i need a little help. I made a table and tried to put a fixed width on it so then I could put text in it. Problem is, -when i type with no spaces ex aaaaaaaaaaaaa the text just keeps going forever instead of dropping down to the next line Also Ive been having some other problems -if I zoom in to like 200% on IE my text doesnt stay centerd with the page, it stays centered with the screen -And if I zoom in really far in Fire Fox my background stays centered with the screen instead of the page I made the page using photoshop and exported as html to get me started so ill post the whole script. Its not a whole lot. --------------------------- <html> <head> <title>K2 Layout 3-0</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> body { background-image: url(images/bg2.jpg); background-repeat: repeat-y; background-position: center; background-color: #0d141e; } body,td,th { color: #FFF; } </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- Save for Web Slices (K2 Layout 3-0.psd) --> <center> <table id="Table_01" width="1024" height="225" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="4"> <img src="images/K2-Layout-3-0_01.gif" width="93" height="225" alt=""></td> <td colspan="6"> <img src="images/K2-Layout-3-0_02.gif" width="840" height="166" alt=""></td> <td rowspan="4"> <img src="images/K2-Layout-3-0_03.gif" width="91" height="225" alt=""></td> </tr> <tr> <td colspan="5"> <img src="images/K2-Layout-3-0_04.gif" width="714" height="1" alt=""></td> <td rowspan="2"> <img src="images/K2-Layout-3-0_05.gif" width="126" height="43" alt=""></td> </tr> <tr> <td> <img src="images/K2-Layout-3-0_06.gif" width="71" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_07.gif" width="211" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_08.gif" width="141" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_09.gif" width="163" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_10.gif" width="128" height="42" alt=""></td> </tr> <tr> <td colspan="6"> <img src="images/K2-Layout-3-0_11.gif" width="840" height="16" alt=""></td> </tr> </table> <table id="Table_02" fixed width="830" border="0" cellpadding="0" cellspacing="0"><tr><td> Text Here Text Here Text Here Text Here </td></tr> </table> </center> <!-- End Save for Web Slices --> </body> </html> -------------------- Any help at all appreciated Thanks 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. Id like to put multiple tables on one of my web pages. Each would contain an RSS feed, but how do i get the tables in the same row ? id like it to look kinda like this in my page. <table1> <table2> <table3> <table4> <table5> <table6> <table7> <table8> <table9> Can anyone tell me how to achieve this? Thanks Jake Ok so you can see from my attachment what I want. I want the bottom row to be all-in-one, so I can centre (center..) the text. But not sure how to do this. Code: <tr> <td>username</td> <td>password</td> </tr> <tr> <td>forms....</td> <td>..........</td> </tr> <tr> ......how to get it to display all of this one? </tr> <td> Code: <table width="400" border="2" class="pay" id="pay"> <col class="itemsDesc" /> <colgroup span="2" class="firstCol" /> <colgroup span="1" class="feeCol" /> <thead> <tr> <th>Lessons</th> <th>Per Term</th> <th>Per Year</th> </tr> </thead> <tbody> <td>30 minutes</td> <td>$600</td> <td>$1100</td> </tr> <tr> <td>45 minutes</td> <td>$850</td> <td>$1600</td> </tr> <tr> <td>60 minutes</td> <td>$1100</td> <td>$2100</td> </tr> </tbody> </table> and my css: Code: * {margin: 0px; padding: 0px} body {font-size: 14px; font-family: 'Lucida Grande', Verdana, sans-serif} table.pay {table-width: 400px; border: 10 px outset rgb(68, 76, 169)} table.pay thead {background-color: ivory; border: 1px} table.pay col.firstCol {background-color: rgb(255, 255, 192)} table.pay col.feeCol {background-color: rgb(232,232,255)} table.itemsDims {width:12%;} im supposed to create a heading row group, a body row group, and column groups containing one column element belonging to the firstCol class, and another column element belonging to the feeColumns class which should span two columns in the web table. was just wondering where im going wrong here since when i do my css.. the background colors or no changes seem to be applied to the columns or the headers (thead) Hi, im relatively new to html and I need help with creating tables for making a proffesional site for a practice assignment. Iv'e attached an image of the way I would like the site to look... I also need help with one other thing, when the mouse pointer is moved over the buttons at the top id like them to display a drop down menu of sub categories. Thanks in advance 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 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... 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. hi all, i'm having problems with tables i want it to look like this: http://www.exsilentio.org/apa/test/want.jpg here's the site, i don't know why they're not next to eachother, and at one point they were, but when i made the window smaller they weren't next to eachother...i also tried making a big table to put those tables in and it didn't work...thanks Code: <html> <head> <title>top</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"><!-- #table1, #table2 { float: left; margin-left: 0.5em; margin-right: 0.5em; } html, body {scrolling: auto;} </style> </head><center> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table id="Table_01" width="992" height="151" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="7"> <img src="images/top_01.gif" width="992" height="109" alt=""></td> </tr> <tr> <td> <img src="images/top_02.gif" width="143" height="18" alt=""></td> <td> <img src="images/top_03.gif" width="145" height="18" alt=""></td> <td> <img src="images/top_04.gif" width="144" height="18" alt=""></td> <td> <img src="images/top_05.gif" width="144" height="18" alt=""></td> <td> <img src="images/top_06.gif" width="144" height="18" alt=""></td> <td> <img src="images/top_07.gif" width="19" height="18" alt=""></td> <td> <img src="images/top_08.gif" width="253" height="18" alt=""></td> </tr> <tr> <td colspan="7"> <img src="images/top_09.gif" width="992" height="24" alt=""></td> </tr> </table></center> <center><table id="big1" width="973" border="0" cellpadding="0" cellspacing="0"><td> <table id="table1" width="720" border="0" cellpadding="0" cellspacing="0"> <td align="left"><img src="images/bottom_01.gif" width="720" height="7" alt=""></td> <tr><td align="center"bgcolor="d6d6d6">dsafasdf<Br><br>asfdasdfsd<br></td><tr> <tr><td align="center"><img src="images/bottom_07.gif" width="720" height="4" alt=""></td></tr></table> <table width="19" cellpadding="0" cellspacing="0"><td> <img src="images/spacer.gif" width="19" height="5" alt=""></td> <table id="table2" width="253" cellpadding="0" cellspacing="0" border="0"> <td align="right"><img src="images/bottom_03.gif" width="253" height="5" alt=""></td> <tr><td align="center"bgcolor="d6d6d6">dsafasdf<Br><br>asfdasdfsd<br></td><tr> <tr><td align="center"><img src="images/bottom_07.gif" width="253" height="4" alt=""></td></tr></table> </table> </body> </html> site |