When a parent div has floated children div containers, apply clearfix class to parent container so the children floats are cleared and the parent container’s height is correct.

/* new clearfix */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */


New clearfix method thanks to Perishable Press.

Published on July 26, 2010