I have a <td> that is just about empty since it only contains an . The height I’m trying to enforce is 110 pixels, but for some reason the table cell is rendered with a height of 182.317 pixels. Why?
There are a few things I already checked:
- The
font-sizethat applies to the non-breaking space isn’t set to something that cannot fit into the table cell. - There’s no table cell on the same row that needs to stretch in order to fit its content into that cell.
- There’s no piece of CSS code that overwrites the height I want with the inexplicable value of 182.317 pixels.
What else could be the culprit? The cell renders with the expected height in Chrome, but it messes up in Firefox 3.6. The rendering mode is XHTML 1.0 Strict (yes, I did validate).
Update: you can view and analyze the page at http://labs.pieterdedecker.be/vspwpg/. The <td> I’m talking about is leftbartop.
You don’t say which of the columns in the table has the issue. But, I suspect that it is:
The attribute
colspan="2"tells the cell to be two rows high. Your rows are 95px, that would make it 190px high (roughly the height you are seeing).Each row in your table specifies a different number of columns 5, 1 and 3. This might explain why the table is rendered differently by different browsers.