border-collapse : collapse; CSS bugs with tables

This cell should not be visible.
This cell should be surrounded by a single 1px red border.

What we have above is a regular table with two cells: the first one has been hidden while the other is visible. border-collapse : collapse; has been applied and borders of 1px added to both table and cells. However, both Firefox and IE render the table incorrectly: Firefox doesn't render the borders at all while Internet Explorer renders the border of the hidden cell.

This bug exists in Firefox up to version 2 and in Internet Explorer versions 5 to 7.

How to resolve?

In this case you could resolve the bug by hiding the entire row instead.

Opera bug

Below is another table with four cells: the first one is hidden while the other ones are visible.

This cell should not be visible. This cell should be visible.
This cell should be visible. This cell should be visible.

Opera renders only half of the top border of the table while it should render all of it. This bug exists in versions from Opera 7 to Opera 9.10.

How to resolve?

You must have an empty cell in the table.

Return to main page