子元素浮动不能正常显示的解决办法

在web前端开发中，清除浮动也算是一个小难题，总结了一下解决浮动的几个方式，简单粗暴，直接有效。

问题描述：当子元素使用了float属性时，父容器无法根据子元素高度而自适应高度，为了解决该问题，通常有以下这种做法：
3.直接在父容器中清除浮动

<div class="clearfix"> <div class="fl"> </div> </div>

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden} .clearfix{display:inline-block}*html .clearfix{height:1%}
　　　　这是最直接有效的方法，而且不会带来其他影响，建议采用。