After you discard the support for IE/Mac, the new floating clearing method is as follows:
/* 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 */
Note:
IE6 and IE7 do not support the pseudo-class "after". Therefore, the following two pseudo classes are required to trigger haslayout of IE6/7 to clear the float. Fortunately, IE8 supports the following pseudo classes: After. Therefore, only the hack for IE6/7 is required.
Sugar with tomatoes:
Jeff Starr uses two statements for IE6/7 to trigger haslayout. I was wondering why the author did not directly use * to apply ZOOM: 1 to IE6/7 or write it directly as follows:
. Clearfix: After {visibility: hidden; display: block; font-size: 0; content: ""; clear: Both; Height: 0 ;}. clearfix {* ZOOM: 1 ;}
From: http://www.cnblogs.com/zllwebjs/archive/2010/03/19/1689980.html