父級盒子無高度，子盒子浮動，高度自適應

利用浮動實現三列布局，中間寬度自適應

 #box{ border: 1px solid red;
    } #left{ width: 120px; height: 300px; float:left; background-color: grey;
    } #main{ height: 500px; margin: 0 220px 0 140px; background-color:skyblue;
    } #right{ width: 200px; height: 600px; float: right; background-color: grey;
    } <div id="box"> <div id="left"></div> <div id="right"></div> <div id="main"></div> </div>

 

方法一：父級盒子添加一堵牆，用clear：both清除浮動

<div id="box">
    <div id="left"></div>
    <div id="right"></div>
    <div id="main"></div>
    <div class="clear"></div>
</div>

方法二：父級盒子添加overflow：hidden