Code For This Table Layout? html help needed

[snlildude87 0]

Hey, can anyone help me generate the code needed for a table that would look something like this?

  ----------------------------------------------------- |                                   |---------------- | |                                   |---------------- | |                                   |---------------- | |                                   |---------------- | |                                   |---------------- | |                                   |---------------- |  ------------------------------------------------------

Thanks in advance!!

[fffanatics 0]

yeah its simple

<table> <tr>  <td></td>  <td>   <table>    <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>  </td> </tr></table>  

so just use this code and insert the text or what not in the empty td's. By the way what i did was i created one table at first that would handle the two columns. Then i created a single row. In it you can fill whatever you want just by adding it between the <td> and <\td> tags. Then i created a second table inside the right column that its self has 7 rows of nothing at this point. Just add the content between the <td> and </td> tags of the second table. Therefore, for instance you wanted to add another single row below what you have drawn, all you would do is create another row in the main table with <tr> and </tr> and inside of it you would create one column and make it span the table's two columns with <td colspan="2"> content </td>

Hope this helps

[beeseven 0]

Here you go:

<table style="width: 99%;" border="5"> <tr>  <td rowspan="7" colspan="2" style="width: 66%;">text</td>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr></table>

[beeseven 0]

Very sorry to double post, but I was fixing my code so I didn't see someone had posted.The w3c doesn't really like putting tables inside tables, and it works better in most browsers to use rowspan and colspan instead.

[Tyssen 0]

The w3c doesn't really like putting tables inside tables, and it works better in most browsers to use rowspan and colspan instead.

The W3C doesn't like the use of tables for presentation at all.
You'd be better off doing:

<div id="main"><div id="right">ContentContentContentContentContentContent</div></div>#right {float: right;}

Or if you have to use a table, do the same as above but apply the id to the internal table so it's still floating right. Then you can use other CSS to play around with the padding/margins etc to get it exactly where you want.

[FaLgoR 0]

<table><tr><td width="500">Left contect goes here</td><td width="150"><table><tr><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td></tr></table></td></tr></table>

Try this one, I think it will help you

[snlildude87 0]

Here you go:

<table style="width: 99%;" border="5"> <tr>  <td rowspan="7" colspan="2" style="width: 66%;">text</td>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr> <tr>  <td style="width: 33%;">text</td> </tr></table>

147147[/snapback]

Yep. I tried this one first because beeseven has a good reputation for posting the correct code for other people, and it worked for me. Thanks!!

 

 

The W3C doesn't like the use of tables for presentation at all.

You'd be better off doing:

 

<div id="main"><div id="right">ContentContentContentContentContentContent</div></div>#right {float: right;}

Or if you have to use a table, do the same as above but apply the id to the internal table so it's still floating right. Then you can use other CSS to play around with the padding/margins etc to get it exactly where you want.

147157[/snapback]

I decided to quit the table layout altogether because I believe tables should only be used to display tabular data, and I will stick to my guns. and plus, there were some other issues with my code that conflicted with the table code

 

 

<table><tr><td width="500">Left contect goes here</td><td width="150"><table><tr><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td><td>blah</td></tr></table></td></tr></table>

Try this one, I think it will help you

149088[/snapback]

I tried this one, but the tables did not display side-by-side. In other words, the second table in your post appeared below the other table.

 

Anyways, I decided to code my navigation with the help of CSS. I set the top value in CSS to 0px, and position to absolute, so that the navigation will stay at the top no matter where my visitors scroll. This only works in Firefox, but the navigation is still visible in Internet Explorer.

 

I'm closing this thread now because my question has been answered a long time ago. Thanks to everyone who contributed!