Floats and Horizontal Negative Margins

container with hasLayout and padding: 10px 10px 10px 50px
float zero, uno with no margins
float two with margin-left:-40px
float three with margin-left:-60px
float four with position:relative; margin-left:-60px
float five with position:relative; left:-60px
clear
container without hasLayout

float uno

float zero

float two

float zero

float three

float zero

float four

float zero

float five

float zero

float uno

float zero

float three

float zero

IE6-/Win: Crops the part of the float outside the container (can be fixed with relative.) If the container has no Layout there is no cropping but other problems.

Floats and Vertical Negative Margins

CSS tests home