css - IE中的 float 问题

Question

#a {

margin-top:25px;
float:right;
width:390px;
margin-left:0px;
margin-right:48px;
padding-left:5px;
border:thin;
 border-color:#999999;
 border-style:solid;
 border-radius: 10px;
 margin-bottom:50px;
}

#b {
margin-top:25px;
/*margin-right:450px; */
width:390px;
margin-left:50px;
margin-right:0px;
/* padding-right:5px; */
border:thin;
 border-color:#999999;
 border-style:solid;
 border-radius: 10px;
 margin-bottom:50px;


}

但问题是#b 不与#a 平行出现(仅在同一行)

Answer 1

标记的顺序也很重要。我的猜测是您的标记类似于:

<div id="b"></div>
<div id="a"></div>

大多数浏览器都会正确地呈现它，但它实际上是错误的方式来排列 block 元素以进行 float ，并且 IE 不会进行补偿。正确顺序:

<div id="a"></div>
<div id="b"></div>

如果您以另一种方式进行操作，IE 会呈现“b” block 元素并将其视为“a” float block 元素无法飘过的天花板。

如果我对标记顺序有误，那么它可能是宽度计算问题，就像@wajiw 建议的那样。