Which Floats are cleared by a Clear?
A float
This div ('nextdiv') follows the float.
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear both the previous floats.
Content inside 'nextdiv' after the clear
A float
This div ('nextdiv') follows the float, and has a left margin equal to the float width.
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' bugzilla 148994
A clear, inside 'nextdiv'. This should clear both the previous floats.
Content inside 'nextdiv' after the clear
A float
This div ('nextdiv') follows the float and is floated itself (with width:50%)
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear only the last float.
Content inside 'nextdiv' after the clear
A float
This div ('nextdiv') follows the float and has overflow:hidden.
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear only the last float.
Content inside 'nextdiv' after the clear
A float
This div ('nextdiv') follows the float and has overflow:auto.
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear only the last float.
Content inside 'nextdiv' after the clear
A float
This div ('nextdiv') follows the float and has display:table (with width:50%)
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear only the last float.
Content inside 'nextdiv' after the clear
A float
This div ('nextdiv') follows the float and has display:table (with width:auto)
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear only the last float.
Content inside 'nextdiv' after the clear
The following is the same as the first case, but now 'nextdiv' has hasLayout, and all is wrapped in a div with hasLayout (for IE7-/Win.)
A float
This div ('nextdiv') follows the float.
A float inside 'nextdiv'
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear both the previous floats.
Content inside 'nextdiv' after the clear
This div ('nextdiv') contains two floats (one left, one right) which are moved outside of it, via a negative margin (left for the left float, right for the right one) greater or equal to the floats width.
A float inside 'nextdiv' in the source
A float inside 'nextdiv' in the source
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear both the previous floats, even if they are moved outside this container.
Content inside 'nextdiv' after the clear
Like the previous one, but with hasLayout on 'nextdiv'.
This div ('nextdiv') contains two floats (one left, one right) which are moved outside of it, via a negative margin (left for the left float, right for the right one) greater or equal to the floats width.
A float inside 'nextdiv' in the source
A float inside 'nextdiv' in the source
Content inside 'nextdiv' Content inside 'nextdiv' Content inside 'nextdiv'
A clear, inside 'nextdiv'. This should clear both the previous floats, even if they are moved outside this container.
Content inside 'nextdiv' after the clear
CSS tests home