當(dāng)子div使用了float之后，父級(jí)div就不能自適應(yīng)子div的高度。其實(shí)有不少解決辦法，最簡(jiǎn)單有效的有兩種，這里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>

實(shí)際效果如圖：

目標(biāo)效果圖：

1、加上clear清除浮動(dòng)

這個(gè)方法很簡(jiǎn)單，就是使用clear，設(shè)定div的左側(cè)和右側(cè)均不允許出現(xiàn)浮動(dòng)元素。
<div class="mydiv">
   <div class="mydiv-fl"></div>
   <div class="mydiv-fr"></div>
   <div style="clear:both"></div>
</div>

2、使用overflow:hidden

就是在父div增加一個(gè)屬性，變成

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

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