Inline elements 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:inline 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 & IE8b

Passed: Gecko 1.7~1.9 & Safari 3 (showing overlap)

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

display:inline-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.9, Safari 3 & IE8b

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

Not supported: Gecko 1.7~1.8

display:inline-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: Gecko 1.9, Opera 9.10~9.5 & IE8b

Failed: Safari 3 (line boxes ecscape element since the element is sized by the green float)

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

  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