當子div使用了float之后，父級div就不能自適應子div的高度。其實有不少解決辦法，最簡單有效的有兩種，這里icech介紹一下。

代碼如下：
<style>
.mydiv{ background:#EEE;}
.mydiv-fl{ float:left: width:300px; height:500px;}
.mydiv-fr{ float:right; width:300px; height:500px;}
</style>
<div class="mydiv">
   <div class="mydiv-fl"></div>
   <div class="mydiv-fr"></div>
</div>

實際效果如圖：

目標效果圖：

1、加上clear清除浮動

這個方法很簡單，就是使用clear，設定div的左側和右側均不允許出現浮動元素。
<div class="mydiv">
   <div class="mydiv-fl"></div>
   <div class="mydiv-fr"></div>
   <div style="clear:both"></div>
</div>

2、使用overflow:hidden

就是在父div增加一個屬性，變成

.mydiv{ background:#EEE; overflow:hidden; }

以上兩種方法都比較有效，而且簡單，更推薦第二種方法。