Floats and (Vertical) Negative Margins
- container with dimension and padding: 50px 10px 10px 10px
- float zero with no margins
- float two with margin-top:-40px
- float three with margin-top:-60px
- float four with position:relative; margin-top:-60px
- float five with position:relative; top:-60px
- float one with clear:both
- clear
- container without dimension
float zero 1
float zero 2
float zero 1
float zero 2
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.
IE7-/Win: The second float doesn't go to the right when the first one is moved sufficiently towards the top to leave space for it. OK with clear on the second float.
Floats and Horizontal Negative Margins
CSS tests home