Overflow test

The green box has dimension 100px × 100px, padding 10px. The blue bar (width 110px) should overflow at the right, and the red one (height 110px) at the bottom.

float, overflow:visible

right

bottom

not float, overflow:visible

bottom

not float, overflow:visible, wrapped in a float

right

bottom

float, overflow:hidden

right

bottom

not float, overflow:hidden

bottom

not float, overflow:hidden, wrapped in a float

right

bottom

not float (no padding), overflow:hidden, wrapped in a float

right

bottom

With overflow:visible IE6-/Win expands the container instead of allowing the content to overflow. IE/Mac has a totally anomalous behaviour (partially similar to IE/Win.)

CSS tests home