Please Reload



NEST EASY



Nesting tables simply means
putting one table inside another.
Let's start in the middle
and work our way out...



Here is a basic table:





Here is the code for it:


<table bgcolor="maroon"cellpadding="0"
cellspacing="0"border="5"height="50"
width="50"><tr><td align="center">
</td></tr></table>




Now let's put our table
inside another one:





Here is the code for it:


<table bgcolor="white"cellpadding="0"
cellspacing="0"border="5"height="75"
width="75"><tr><td align="center">


<table bgcolor="maroon"cellpadding="0"
cellspacing="0"border="5"height="50"
width="50"><tr><td align="center">
</td></tr></table>


</td></tr></table>


As you can see, our first table
became the entire contents
of the TD cell of the second table.

Let's do it again !!




 Here is the code for it:


<table bgcolor="blue"cellpadding="0"
cellspacing="0"border="5"height="100"
width="100"><tr><td align="center">

<table bgcolor="white"cellpadding="0"
cellspacing="0"border="5"height="75"
width="75"><tr><td align="center">

<table bgcolor="maroon"cellpadding="0"
cellspacing="0"border="5"height="50"
width="50"><tr><td align="center">
</td></tr></table>
</td></tr></table>
</td></tr></table>


 We've done the same thing....
Our package of two tables
became the entire contents
of the TD cell of the third table.
NOTE: Three tables, three table closures....!!!!!


Now if you can put a table
inside ANY cell,
you can put several tables
inside one cell; and arrange them
any way you want.







One under the other;
no outside table.

Here is the code.


<table bgcolor="white"cellpadding="0"
cellspacing="0"border="5"height="75"
width="75"><tr><td align="center">
<table bgcolor="maroon"cellpadding="0"
cellspacing="0"border="5"height="50"
width="50"><tr><td align="center">
</td></tr></table>
</td></tr></table>

<table bgcolor="white"cellpadding="0"
cellspacing="0"border="5"height="75"
width="75"><tr><td align="center">
<table bgcolor="maroon"cellpadding="0"
cellspacing="0"border="5"height="50"
width="50"><tr><td align="center">
</td></tr></table>
</td></tr></table>

<table bgcolor="white"cellpadding="0"
cellspacing="0"border="5"height="75"
width="75"><tr><td align="center">
<table bgcolor="maroon"cellpadding="0"
cellspacing="0"border="5"height="50"
width="50"><tr><td align="center">
</td></tr></table>
</td></tr></table>







One on top of the other
with outside table:



Three across;
outside table a MUST...
An invisible table may be used....
Here is the code:



A table of two cells in each of two rows.







The possibilities are endless.

Check out these nested tables:

Nine Nested


Now where did he come from??




SimplySally©2003