我常用的都是clear:both;方法，如


<div style="clear:both">
   <div style="float:left"></div>
  <div style="float:right"></div>
</div>



今在PlanABC看到另外這種方法，特些記錄下來(lái)。

div.container {
 border: 1px solid #000000;
}

div.left {
 width: 45%;
 float: left;
}

div.right {
 width: 45%;
 float: right;
}


層套關(guān)系：container的div包含left和right

最簡(jiǎn)單合理的清除浮動(dòng)的方法（紅色粗體部分）：

div.container {
 border: 1px solid #000000;
 overflow: hidden;
 width: 100%;
}

兼容情況：IE6 IE7 FF MacIE等

來(lái)源地址：http://www.quirksmode.org/css/clearing.html

PS：不過(guò)在使用的過(guò)程貌似還有小的BUG，淘寶的小馬曾碰到過(guò)，具體的癥狀是，IE6中層套清除浮動(dòng)的div，導(dǎo)致部分鏈接無(wú)法點(diǎn)擊。

最新評(píng)論