十二 04 2009
ie6双倍边距的成因以及解决
第一种，也是最常见的一种就是上面说到的，设置了浮动（float）后再设置外边距（margin），外边距就会是原来值的2倍。请看下面的代码：
1、问题：从上面例子中“margin:10px 0 0 10px”可以看出，上边距和左边距同样为10px，但第一个对象距左边有20px。
2、解决办法：当将其display属性设置为inline时问题就都解决了。
3、说明：这是因为块级对象默认的display属性值是block，当设置了浮动的同时，还设置了它的外边距就会出现这种情况。也许你会问：“为什么第二个对象和第一个对象之间就不存在双倍边距的BUG”？因为浮动都有其相对应的对象，只有相对于其父对象的浮动对象才会出现这样的问题。第一个对象是相对父对象的，而第二个对象是相对第一个对象的，所以第二个对象在设置后不会出现问题。
4、总结：这个现象仅当块级对象设置了浮动属性后才会出现，内联对象（行级对象）不会出现此问题。并且只有设置左边距和右边距的值才会出问题，上下边距不会出现问题。
第二种，也是比较常见的一种。当对象1设置了左浮动，对象2在不设置取消浮动的情况下会浮在对象1的右边。但当对象2不设置浮动时，二者之间会出现空隙。请看下面的代码：
1、问题：对象1设置浮动，对象二没设置浮动，在IE6中二者之间会出现间隙。在FireFox下对象2默认是取消浮动换行显示。FireFox下如图：
2、解决办法：设置对象2的浮动“float:left;”。若想使二者间有距离，可以设置外边距margin属性。