Tables Within Tables

Also inserting pictures into fixed sized cells

[rock007]

I use Front Page and frequently have tables within tables. If I have a large TABLE of 100 pixels wide, can I insert two smaller tables of 50 pixels each, or does each side of each table take up pixel spaces as well that I must allow for when inserting the two smaller tables? In other words, is the larger table really 100 pixels of usable space, or is it 96 or 98 pixels of usable space with 2-4 pixels of space used up for the sides of the table? (same scenario for the smaller tables.)
Also, can I insert a picture that is 100 X 100 pixels into a CELL that is 100 X 100 pixels or how much space do I have to add to each side of the CELL to accomodate for the picture and the cell edges?

[Stefan]

Not sure about Frontpage (never used it), but if you have these attributes in the table "border=0 cellspacing=0 cellpadding=0",you should have the whole works available. It's probably that way by default unless you specify a border or whatever, but I'm not 100% on that. Take a look at the Frontpage html code with Notepad.

[Corey Bryant]

Embedding tables is never really a good idea (browser issues). You can do it but you would need to use styles to float one of the tables to the left preferably.

I would just use the cells.

-Corey

[pageoneresults]

I use Front Page and frequently have tables within tables. If I have a large TABLE of 100 pixels wide, can I insert two smaller tables of 50 pixels each, or does each side of each table take up pixel spaces as well that I must allow for when inserting the two smaller tables?

I would go with Corey's suggestion and manage cells rather than tables within tables. Many times, people nest tables to achieve certain border/visual effects. While this is visually appealing, it creates an html nightmare and causes problems with some browsers.

In working with cells to achieve what you want, you'd end up with something like this...

<table border="0" width="100">
<tr>
<td width="50">&nbsp;</td>
<td width="50">&nbsp;</td>
</tr>
<tr>
<td width="50">&nbsp;</td>
<td width="50">&nbsp;</td>
</tr>
</table>

[rock007]

Great suggestions! I will try them.
-Rocky

[Yukitenshi]

Additonal note: Remember to add "cellpadding="0" and cellspacing="0" to the table tag, otherwise they will be set to a value of "1" by default. :)

So ..

<table border="0" cellpadding="0" cellspacing="0" width="100">

[rock007]

Thank you.

I will.

-Rocky

[normaldude]

<table border="0" width="100">
<tr>
<td width="50">&nbsp;</td>
<td width="50">&nbsp;</td>
</tr>
<tr>
<td width="50">&nbsp;</td>
<td width="50">&nbsp;</td>
</tr>
</table>

The way I would do it..

- I would recommend using percentages for the inside cells. That way, if you resize the outside table width to 150 or 75, the inside cells resize automatically. I often do this with whole web pages, where there's one outside table that's 730 pixels wide, and all the other nested cells & tables are based on percentages.

- You only need to designate the "width" attribute for the first row of cells. Those width values will automatically propagate the the other rows.

- I think it's a good idea to use comments to designate the matching starting and ending table tags. That way, as you have more & more nested tables, you know which tag matches which.

So my modified version would be..

<!--- START: 2 Column Table Example --->
<table width="100" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<!--- END: 2 Column Table Example --->

[rock007]

Great info!

Thanks.

-Rocky