IE6下的双边距bug

在IE6下如果一个块元素被添加浮动属性，它的横向margin值会变成在标准浏览器下的两倍

如果有多个块，只会影响首尾

正常的情况jsbin

同样的代码放在IE6下

很明显，margin-left:30px变成了60px

造成这种现象必须满足三个条件：

1. 块元素
2. 浮动
3. 有横向margin

解决办法只要破坏掉任一条件即可

1. display:inline（让块元素变成内联元素）
2. 不要使用浮动
3. 用padding-left代替margin-left