Posted by Ben C on 07/26/07 07:45

On 2007-07-26, Jim <blkbam@gmail.com> wrote:
> I'm working on a new layout for my site and everything shows up
> perfectly as expected in IE but FF doesn't behave as expected. FF
> adds a lot of extra space when I resize the spacer images on the sides
> of the page. If you select the radio buttons you'll see what I mean.
> Event the initial size seems to be off a bit as you can see the gaps
> in the images when the page first loads.

If you'd like to explain exactly why you expect your riot of rowspanning
and colspanning cells to look any particular way I would be interested
to hear it.

In a table each cell gets a height from the whole row and the height of
the row is a function of the contents of each cell. This is exactly the
behaviour you _don't_ want for this page.

When you click one of the radio buttons, a different list of burgers
appears below, changing the height of the main content area a bit. This
shouldn't affect the sidebars at all (or certainly not the spacing
between items on the sidebars), so just don't make the sidebars part of
the same table in the first place.

In fact there's no reason to use tables at all on that page.

Rowspan and colspan make life even more complicated because the browser
has to decide how to distribute the contribution of a cell's content
dimensions and any styled or percentage dimensions on it across the rows
or columns it spans.

Only a very small amount of this is specified in any detail, so you
cannot expect identical results between any two browsers.

[Back to original message]