CSS Clear Float

The height of the parent element is stretched by the child element, and the children are set to float, the parent element is not set to float, the child element is detached from the standard document flow, the height of the parent element is ignored, and if the float is not cleared, the parent element will appear highly insufficient. That way, if the settings border or background are not correctly parsed.

To clear floating methods:

1. Add Overflow:auto to the floating element parent, and add the zoom:1 to the IE6

2. Use: After pseudo element

. clearfix:after{
Content: "";
Dispaly:block;
height:0;
Clear:both;
Visibility:hidden;
}
. clearfix{
Zoom:1;
}
Or:
. clearfix:after,.clearfix:before{
Content: "";
display:table;
}
. clearfix:after{
Clear:both;
}

CSS Clear Float