【CSS经典问题】子元素浮动之后如何撑开父元素

按照CSS规范，浮动元素（float）后会被移出文档流，不会影响到块状盒子的布局而只会影响内联盒子（通常是文本）的排列，所以不会撑开父元素的高度。但是很多时候我们需要页面根据内容自动调整高度的。如何解决这个问题呢？有6个方法：

（1）在浮动子元素后面添加

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

（2）父元素CSS添加

z-index:1; overflow:hidden;

（3）绝对定位/静止定位(absolute/fixed)。

（4）父元素也跟着浮动。

（5）父元素设定高度。

这个是掩耳盗铃的方法，实质上并没有解决问题，但效果看起来是一样的，如果父元素高度固定，可以用这个方法。

（6）父元素CSS添加：

overflow:auto;_height:1%;

 这个是我认为是最佳方案。