Keith Devens .com

CSS can't replace tables

Well, I just had my suspicions confirmed tonight after talking with two nice folks on #mozillazine. To put it real succinctly, you can't specify the height of a floated block with percentages if you don't specify the height of the containing block in absolute units, because the spec says that "If the height of the containing block is not specified explicitly (i.e., it depends on content height), the value is interpreted like 'auto'."

So =height:auto=, =height:inherit=, and =height:nn%= all mean the same damn thing if you don't specify the height of the containing block explicitly.

It's very unfortunate, because this one thing makes it impossible to simulate many table-based layouts in CSS. The two people I was speaking with both agreed that this is a bug in the spec, and we hope it'll be fixed in CSS3.

At least now I have a definite answer, that it's truly impossible to do the design I wanted to do without tables.

P.S. To show you what you wind up with (what I was trying to do is obvious), check out my final attempt to do a CSS-based layout without tables.

P.P.S. To show you that I'm right, check this out. This is the exact same code as the previous example, but with an absolute height (of 3 inches) set for the div containing the section between the header and footer.

P.P.P.S. Hey, check this out: It actually looks like they fixed it in the CSS3 box model working draft. They made percentage values relative to the computed height of the containing block, which is exactly what it should have been in the first place. From the spec:

A <percentage> is relative to the computed value of the width or height of the containing block, but if that value is 'auto' the computed value for the percentage is also 'auto'.

I'm still not sure I like percentage values collapsing into "auto" again if the containing block's height is "auto", but ~~at least they corrected the part of the spec that I'm taking issue with right now~~

Yeah, I'm a moron, at 5:30am or whenever I read this I thought this meant that they had fixed it. In fact, this is the same behavior as before, since percentages mean "auto" if the containing block's height isn't specified absolutely. Boo.