Block elements with a width and floats

Under reveiw and testing, 11th June 2008

Note: No implementation can be really be said to have passed or failed any of these test but rather it's how I understand the specs (making notes). The tested elements have two colors. The boxes with a blue background are those properties and values that establish a new block formating context.

Display Properties

display:block x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5, Gecko 1.7~1.9, Safari 3 & IE8b1

Failed: IE 5.5, IE 6, IE 7 (due to IE/Win escaping float bug)

display:run-in x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5, Gecko 1.7~1.9 & Safari 3

Failed: IE8b1 (showing as display:inline)

Not supported: Gecko 1.7~1.8, IE 5.5, IE 6, IE 7

display:table x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5, Gecko 1.7~1.9 & Safari 3

Failed: IE8b1

Not supported: Gecko 1.7~1.8, IE 5.5, IE 6, IE 7

display:table-cell x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5 & Gecko 1.7~1.9

Failed: IE8b1 & Safari 3

Not supported: Gecko 1.7~1.8, IE 5.5, IE 6, IE 7

display:table-row x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5 & Gecko 1.7~1.9

Failed: Safari 3

Unknown: IE8b1

Not supported: Gecko 1.7~1.8, IE 5.5, IE 6, IE 7

Overflow Properties

overflow:auto x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5 & Gecko 1.9 (Firefox/2.0.0.14

Passed: Gecko 1.7~1.8 & Safari 3 (stacking over float)

Failed: IE8b1

Failed: IE 5.5, IE 6 & IE 7 (due to IE/Win escaping float bug)

overflow:hidden x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x

Passed: Opera 9.10~9.5 & Gecko 1.9

Passed: Gecko 1.7~1.8 & Safari 3 (stacking over float)

Failed: IE8b1

Failed: IE 5.5, IE 6 & IE 7 (due to IE/Win escaping float bug)

  1. Inline elements with a width and floats
  2. Inline elements and floats
  3. Block elements with a width and floats
  4. Block elements and floats

CSS Class test