哪种clearfix方法？

Question

/*清除修复*/

.clearfix:after {content: ".";display:block;height:0;clear:both;visibility:hidden;}
* html .clearfix {height:1%;}

或

.clearfix:after {content: ".";display:block;height:0;clear:both;visibility:hidden;}
* html .clearfix, *:first-child+html .clearfix {zoom:1;}

哪一个效果最好？我现在用的是第一个，从来没有出过问题..谢谢。

Answer 1

最简洁的技术是设置overflow:对现代浏览器隐藏：

overflow:hidden;
zoom:1;

如果一个元素需要流出维度(负边距或位置)，那么clearfix：

#el:after { content:""; clear:both; display:block; visibility:hidden; }

对于IE6及以下版本，您需要触发hasLayout (通过宽度、缩放:1、高度和其他属性/值组合)。从IE7开始，overflow将清除浮动。

Answer 2

后者似乎还不错，因为它还考虑了IE6 (zoom:1;)。

Answer 3

这对我来说一直都很有效。和你的非常相似

.clearfix:after {
    content: "."; 
    display: block;
    height: 0; 
    font-size:0;
    clear: both; 
    visibility:hidden;
}
    .clearfix{display: inline-block;}
    * html .clearfix {height: 1%;}
    .clearfix {display:block;}