特性：
float的设计初衷仅仅是文字环绕效果
浮动具有破坏性,会使父容器高度塌陷
清除浮动方法: 1.脚底插入cleart:both 2.父元素BFC(IE8+)/haslayout(IE6/7)
两者差异: 1.与外部链接,会发生margin重叠 2.封闭式,不会外部发生冲突
两者不足: 1.多余空标签 2.兼容性无法一方通行
权衡后的策略: .clearfix需作用在父元素上
1 IE8+: clearfix::after{ conter:‘‘; display: block; clear: both; height: 0; overflow: hidden;}2 IE6/7: celarfix { *zoom:1; };3 优化: .clearfix::after{ content: ‘‘; display: table; clear: both;}注意项
容错性糟糕,容易出问题
需要元素固定尺寸,无重用性
在IE低版本下,会引发很多问题
兼容性问题
IE6: 浮动有双倍边距,跟随浮动元素3px,后面文字会下沉
IE7: 浮动元素与文本不在同一行,最后一个字符重叠....
CSS之 float 属性
原文地址：http://www.cnblogs.com/Beck-Z/p/7691952.html