float 似乎与 overflow 成对出现

<div id="outer" style="background-color: red; overflow:hidden;margin:10px 50px;">

　　<div id="boxLeft" style="background-color:green; float:left; width:400px; height:300px;">hello</div>

　　<div id="boxRight" style="background-color:blue; float:right; width:400px; height:300px;">world</div>

</div>

去掉overflow:hidden和不去掉试试，发现去掉后父级元素被折叠，使用overflow:hidden 相当于清除浮动，父元素把子元素抱起来。