So, You Want A Table Inside A Table, Huh?

By Joe Burns


Desktop-as-a-Service Designed for Any Cloud ? Nutanix Frame

Here's a quick example of a table within a table, with cellpadding, cellspacing and the table border set so you can easily see what's going on within the table:

2nd Table2nd Table
2nd Table 2nd Table
The cell next to this one has a smaller table inside of it, a table inside a table.

How It's Done

Below is the code that created the table above. I have left the text black. The outer table's commands are purple and the inner table's commands are red so you can quickly tell them apart.


           <TD>2nd Table</TD>
           <TD>2nd Table</TD>
           <TD>2nd Table</TD>
           <TD>2nd Table</TD>

<TD> The cell next to this one has a smaller table inside of it, a table inside a table.</TD>

How It's Done

First off, you should really know how to do a simple table before attempting to tackle this monster. See my table tutorial first. Then this will make a lot more sense.

Now, for those of you already up to speed on tables, you can probably pick it up from the code how it's done. You simply make a point of ending every line with an end command. When you do a simple table, you really only need one </TR> and one </TD> command at the end of the table. But here, you need to end every line with its own </TD> and each <TR> with its own </TR>.

A Tip

When I do a table in a table, I tend to get a little confused on what goes with what. I create all the tables separately, making sure every section has its own end command. I create the tables that will go in the cells first. The last thing I make is the larger table. That way, I can create the large table and when I need to fill in the <TD> with a smaller table, I can just cut and paste it in. It also helps me to remember to follow the smaller table with a </TD> for the larger table's benefit. It's super easy to forget one and that can mess up the whole table scheme.

Hope this helps...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
Thanks for your registration, follow us on our social networks to keep up-to-date