CSS float的困惑，高手请进

来源：百度知道 编辑：UC知道 时间：2024/05/03 08:19:45
三个div，分别为框1，框2，框3，边距（margin）为10px，当框2或框3设为float：left 时，距离上面那个框的边距都会变成20px？？

另外当框1（或框2）为float：left 时，框2（或框3）跑到框1（框2）的右边，但两框的边距是13px？？

请教高手，一个元素设为float之后其边距的规律是怎样的？？？

（如附件图所示：当框2设为float：left后，框1和框2上下距离为20px，框2和框3的左右距离为13px）
～～补充： 是在IE7上试的～～

你用的应该是ie6 ，在ie6下，当设置了float属性后，通常情况下margin加倍 ，这是ie6的一个超级大bug。现在已经克服了，你所要做的就是简单地将{display: inline;}设置给浮动元素就是全部所需做的。给你个例子吧

#left{
width:200px;
height:400px;
background:#CCCCCC;
float:left; display:inline;
margin-left:20px;
}

如果框1上面还有浮动float，则给框1加一个clear: both

对框2和框3设定display: inline就可以解决浮动后双倍边距的问题。

另外，如果可以，尽量用padding吧。
同一行的 div，最好都给他们设定一个display: inline要安全的多。

我想问问 第一你的调试的浏览器是IE6 还是IE7 还有就是你把宽度设定了 应该要好点