IE6 では互換性がありません。reason_html/css_WEB-ITnose の分析にご協力ください。

<div class="main">    <div class="leftbar"></div>    <div class="middle"></div>    <div class="rightbar"></div> </div>

一般的なフレームワークは次のようになります。メインに 960px を設定しました。内部の 3 つの div の幅の合計は 960px に等しくなります。 Firefox、Chrom、IE9などでは正常に表示できるのですが、IE6では右divが圧迫されてしまいます。

.main{    margin-top: 5px;    width:960px;    margin:5px auto;    padding:0px;}.main .leftbar{    width:235px;    float:left;    margin-left: 5px;    overflow: hidden;}.main .middle{    width:450px;    float:left;    margin-left:15px;    margin-right:15px;    background-color: #F2F2F2;    overflow: hidden;}.main .rightbar{    float:right;    width:230px;    margin-right:5px;    overflow: hidden;}

ディスカッション（解決策）に返信

IE では境界線の幅が計算され、浮動要素の幅を 2 ​​倍にする必要があるため、3 つの DIV を 960 に設定することはできません

IE6 ブラウザはフローティングをサポートしていません。要素には二重マージン値のバグがあります。解決策は、次の 3 つのフローティング要素の display:inline; スタイルを設定することです。