如果你同时设置元素向一侧浮动和外边距，你会很吃惊的发现，你的布局总不能够如人所愿。原来这是IE 6及其以下版本的双倍边距问题。
试验：
<style type="text/css">
body {/* 清除页边距 */
padding:0; /* 清除标准浏览器页边距 */
margin:0; /* 清除IE页边距 */
}
div {/* 公共样式 */
margin-left:50px; /* 左侧外边距 */
200px; /* 宽度 */
height:100px; /* 高度 */
border:solid 1px red; /* 边框 */
}
.box2 {
float:left; /* 向左浮动 */
}
</style>
<div class="box1">参考元素</div>
<div class="box2">浮动元素</div>
看看效果
此类问题的解决比较简单，你只需要在浮动元素中增加display:inline;规则即可。
.box2 {
float:left; /* 浮动显示 */
display:inline; /* 行内显示 */
}