HTML - Tables Don't Line Up In I.e.
Hello all, I'm trying to do some simple table work for a webpage. The basic set up is this:
Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Team Funcom</title> </head> <body background="background.jpg"> <table border="1" align="center"; cellpadding="0"> <tr> <td width="100%" valign="top"> <table border="1" width="100%"> <tr> <td colspan="3" align="center"> STUFF </td> </tr> <tr> <td colspan="3" align="center"> STUFF </td> </tr> <tr> <td colspan="2"> STUFF </td> <td rowspan="2" align="center"> STUFF </td> </tr> <tr> <td align="center"> STUFF </td> <td align="center"> STUFF </td> </tr> <tr> <td colspan="3"> STUFF </td> </tr> </table> </td> </tr> </table> </body> </html> I'm using some CSS to do some transparancy and some JavaScript to change some menu images onmouseover, not shown here. The problem is that when I put the rest of my code into the above tables, things line up in Opera, but not in I.E. I am using a table within a table, so that I can line things up in the center of the page, and that seems to be causing the problem. In Opera the outer table centers and is only as wide as it needs to be, but in IE the outer table's width takes up the whole page. Also, as I make the page smaller in I.E., the tables seems to overlap. Firefox makes things line up a bit better, but there are still some problems. Any thoughts here? I've attached the full code I'm working with. I had to change it to .txt so that I could upload it as an attachment. Here's what the page looks like in Opera at the moment. Similar TutorialsHi 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 this div: Code: <div> Last Name <input name="data[Provider][last_name]" type="text" class="input_style" maxlength="100" value="" id="ProviderLastName" /> <input class="submit_style" type="submit" value="Search" /> </div> The way it's being displayed is having the last name string first and then the input and submit (both of them) under that last name string. I would like for all of these values to be on the same line. How can I do that? <p> doesn't work, tried it. Anything I can do in CSS? hi some help please i want to have 2 styles on one line, first text should be bold second text should be normal the following is from my template file: <div class='header'>BOLD TEXT <a href="user_fof.php" > normal text</a> </div> this stays in the same line but both are bold, i have tried adding a class="normaltextstyle" but the color changes but it still stays bold please assist, Can anyone tell my why an extra line is appearing on this site in IE but not Firefox? And what's causing it, how to get rid of it? http://www.jnsitedesign.com/zenphoto/weddings/ It's the line above the menu. Also why is the menu centering in IE and how do I get it to align to the right? ***nevermind, I figured out the menu. But the line is driving me insane and I can't figure out what's causing it Thanks for any pointers! hello, Im a noob at HTML and was wondeirng if you guys/gals could help me. Im trying to make a bracket and I am not sure how to make the line centered with the other lines. here is the code Code: td { vertical-align: middle; width: 10em; margin: 0; padding: 0; } See how each horizontal lines are centered with the 2 horizontal lines that come before it in this example? http://sharkspage.com/jpgs3/2007bracket2.gif my problem is the code i'm using centers the horizontal line with the words on the lines, not the actual 2 horizontal lines. So if the word on the top line is 50 characters taking up 3 rows, and the word on the bottom line it 5 characters using 1 row, the line is way off-centered. Here is my messed up Bracket http://warchant.0catch.com/WarchantBracket.html here is the HTML, couldn't fit the whole thing here so I only went as far as Region 1 HTML Code: Warchant Movies <html lang='en'> <head> <meta http-equiv='Content-Type' content='text/html; charset=ISO-8859-1'> <title>Page Title</title> <!-- link rel='stylesheet' href='style.css' type='text/css' --> <style type="text/css"> <!-- table { border-collapse: collapse; border: none; font: small arial, helvetica, sans-serif; } td { vertical-align: middle; width: 10em; margin: 0; padding: 0; } td p { border-bottom: solid 1px black; margin: 0; padding: 5px 5px 2px 5px; } --> </style> </head> <body> <table summary="Tournament Bracket"> <tr> <td><b>Region 1</b><p>1. Star Wars: Episode IV - A New Hope</p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> <td rowspan="8"><p></p></td> <td rowspan="16"><p></p></td> <td rowspan="32"><p></p></td> <td rowspan="64"><p></p></td> <td rowspan="128"><b>Champion</b><p></p></td> </tr> <tr> <td><p>32. Wizard of Oz</p></td> </tr> <tr> <td><p><br>16. Fight Club</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>17. Old School</p></td> </tr> <tr> <td><p><br>9. Blazing Saddles</br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> </tr> <tr> <td><p>24. Deer Hunter</p></td> </tr> <tr> <td><p><br>8. Tombstone</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>25. Clockwork Orange</p></td> </tr> <tr> <td><p><br>4. Saving Private Ryan</br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> <td rowspan="8"><p></p></td> </tr> <tr> <td><p>29. Star Trek II: The Wrath of Kahn</p></td> </tr> <tr> <td><p><br>13. The Longest Day</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>20. The Longest Yard (Original)</p></td> </tr> <tr> <td><p><br>12. Apocalypse Now<br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> </tr> <tr> <td><p>21. Jaws</p></td> </tr> <tr> <td><p><br>5. Raiders of the Lost Ark</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>28. Boyz in the Hood</p></td> </tr> <tr> <td><p><br>2. Braveheart</br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> <td rowspan="8"><p></p></td> <td rowspan="16"><p></p></td> </tr> <tr> <td><p><br>31. Say Anything</br></p></td> </tr> <tr> <td><p><br>15. Bridge Over the River Kwai</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>18. The Magnificent Seven</p></td> </tr> <tr> <td><p><br>10. The Incredibles</br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> </tr> <tr> <td><p>23. The Quiet Man</p></td> </tr> <tr> <td><p><br>7. The Godfather</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>26. Tora, Tora, Tora</p></td> </tr> <tr> <td><p><br>3. The Big Labowski</br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> <td rowspan="8"><p></p></td> </tr> <tr> <td><p>30. Return to Me</p></td> </tr> <tr> <td><p><br>14. Young Frankenstein</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>19. Rocky IV</p></td> </tr> <tr> <td><p><br>11. A Bridge Too Far</br></p></td> <td rowspan="2"><p></p></td> <td rowspan="4"><p></p></td> </tr> <tr> <td><p>22. A Few Good Men</p></td> </tr> <tr> <td><p><br>6. Full Metal Jacket</br></p></td> <td rowspan="2"><p></p></td> </tr> <tr> <td><p>27. Goodfellas</p></td> </tr> <br> Appreciate any help Is there an easy way to make a vertical line? For example, some equivalent to <HR> ? Thank you. I'm a complete newbie I have been told to edit a script in html editor on line No. 235. I put the script into an editor and it fills the page as one big paragraph and not in a line format. Is this a common thing Can it be changed? Neil Hi: I've got a narrow but high button. Question: What do I place in the Value="???" option to ensure that I get two lines in a button For Example, I wish to put the following in the value of the button: Edit /Del Of course, I tried ' Value="Edit<br />/Del" ' --- but that didn't work, I also tried : 'Value="Edit\n/Del"' - also , no joy ( Thanks, -Mel Smith 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 Hi all, I have the following code... <BODY> <ul> <li><h3> hello world</h3> I love you </li> </ul> </BODY> Right now this comes out on two separate lines. Is it possible for both texts to be on the same line? Thanks. hi, how can i set td just single line.for long texts, td makes new line.how can i achieve in making td single line no matter how the text is long? Hi: I'm a newbie and am designing my 1st screen using Transistional HTML. Without using CSS, is there a simple way to draw a horizontal line across the screen ? TIA -Mel Smith http://credmond8.awardspace.com/home.phtml How can I get "Site Theme" and "Time" on the same line? For the life of me, I cannot get rid of the small white line on either side of the dark blue in the following: http://www.toddcary.com/test/viewpoi...ew_design.html Any suggestions are welcomed! Todd how can i add onto an html file using php? for example. if i was making a forum chat or something similar, how would i add onto the char using a form, a PHP file, and the main html file that stores the conversation? the thing with this html file is this... Code: <html> <other stuff> <body> PHP file will add text here! <------------------- </body> </html> how do i make the php file add stuff in the middle of the html file? I am trying to build a page using drupal CMS but I have a problem. Whenn add checkbox, text and submit button together, each of them gets in a different line. It looks like i use <br> although i don't. Adding content with a WYSIWYG editor seems to be working into the editor content area. But when I save it, it appears again in different lines,no matter in which place of the frontpage I add it. So I guess I guess the reason is the style.css file. But I can't find the exact line that damages my code. In pictures below you can see 1)the content correctly presented into WYSIWYG editor 2)The content in frontpage (awful) 3)The simple html i use 1) http://www.teicrete.gr/libsite/files...wyg_editor.JPG 2) http://www.teicrete.gr/libsite/files...page_error.JPG 3) http://www.teicrete.gr/libsite/files/3_simple_html.JPG Any help would be great... Thanks in advance! Hi, I've a grid and a charting component included in my form. I haven't included any new line between the grid and chart, but in the display they're on different line. I tried the following: 1. Increased the body width. 2. Tried increasing the <div> height & width. Eventhough the width increases they're still on different line. What might be the problem? Here is the code snippet: <!-- <form id="form1" runat="server"> <div style="vertical-align:middle; height: 1000px; overflow: visible; width:5000px;"> <asp:GridView> ................. /asp:GridView> <cc1:WebChart> .................... /cc1:WebChart> </div> </form> </body> --> Thanks for your time, SD Just learning this stuff. I am having trouble controlling space between lines. My HTML coding is resulting in too much space between lines. I am afraid I have no idea how to control spacing. I have fiddled with different coding. Here is the current version: <td class="headerbg" colspan="2" width="600"> <div align="left"><p style="font-family:verdana; color:00bfff; font-size:30px;" >the amazing alexander technique </p><p style="font-family:verdana; color:00bfff; font-size:20px;" >so much more than 'posture' and pain relief </p> </div> </td> Thanks for any help. Pointing me to resource where I can read the solution would be great. Hey i am having trouble with putting a horizontal line in. I got the line in but it doesn't go all the way across the page. It stops a bit before then end can someone please help? |