Universal Clear Floating style

This is a popular way to clear the float and has been fully adopted on many major projects.

This method is derived from positioniseverything and is implemented by the after pseudo-class: After and Iehack, fully compatible with the current mainstream browser.

. clearfix:after  {    content: ".";    Clear:both;    height:0;    Visibility:hidden;    Display:block;  }  /* This is the processing of Firefox, because Firefox supports the generation of elements, and all versions of IE do not support the generation of elements */. Clearfix{display:inline-block;}/* This is the processing of IE browser on MAC */html . clearfix{height:1%;}/* This is the processing of the IE6 browser on Win */* + HTML. clearfix{height:1%;}/* This is the processing of the IE7 browser on Win */. C Learfix{display:block,}/* This is a modification to display:inline-block, and a reset to a chunk element */

Here's a admin10000.com to clean up the floating code.

. clearfix:after {    content: "020";    Display:block;    height:0;    Clear:both;}. Clearfix {    zoom:1;}

This is the optimized version of the clear floating style, it is highly recommended.

Related documents: CSS clear floating common methods summary