外国人が作成したフロートのクリア（フロートのクリア方法）_体験交流

私がよく使用するのは、

などの clear:both; メソッドです。

PlanABC でこんな方法もあったので記録してみました。

div.container {
ボーダー: 1px ソリッド #000000;
}

div.left {
幅: 45%;
フロート: 左; }

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


レイヤーのネスト関係: コンテナの div には left と右

フロートをクリアする最も簡単かつ合理的な方法 (赤の太字部分):

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

互換性: IE6 IE7 FF MacIE など

ソース アドレス: http://www.quirksmode.org/css/clearing.html

追記: ただし、使用する過程で小さなバグがあるようです。淘宝網の Xiaoma がそれに遭遇しました。具体的な症状は、IE6 中間層がフローティング div をクリアし、一部のリンクが表示されなくなることです。クリック不可。