Safari escapes being buggy on a technicality: it doesn't support the traditional (border-box
)
model.
The box model of a td
turns out to be unchangeable in Explorer (Win
and Mac), Mozilla and Opera.
This page is in Quirks mode Mode, and the td
's and the div
have:
width: 160px; padding: 20px; -moz-box-sizing: border-box; box-sizing: border-box;
In the traditional box model this makes for a total width of 160px, since padding is included in the
width. Explorer Windows, Mozilla and Opera, however, use the W3C box model, which makes for a total width of 300px (260 + 20 + 20).
They correctly give the test div
a total width of 160px, though.
The reverse bug applies to Explorer Mac when using the W3C box model.
Cell 1 | Cell 2 |
In quirks mode, the use of table-layout: fixed
makes Explorer Windows honour the traditional
box model for TDs. It has no effect in the other browsers.
Cell 1 | Cell 2 |