清除浮动

清除浮动

clear:both

给浮动元素后面的元素添加 clear: both 属性。

.element {
	clear: both;
}

空 DIV

<div style="clear: both;"></div>

overflow:触发 BFC

给浮动元素的容器添加 overflow:hidden;overflow:auto; 可以清除浮动,另外在 IE6 中还需要触发 hasLayout ,例如为父元素设置容器宽高或设置 zoom:1

:after

添加一个 :after 伪元素来清除浮动。

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

参考