关于IE对于浮动DIV的margin占双倍的BUG
今天在做一个简单的定位时遇到了很白痴的问题,在ff下设置margin-left:100px;的效果竟然在ie里出现双倍!fuck...,终于在网上找到了解决的办法:
Steve Clason发现了一个修复办法，描述在他的Guest Demo里，修复了双倍边界和围绕文字缩进Bug。这是一个经典的IE的Bug修复办法，使用一个属性来修复影响不相关属性的Bug。
现在如何来做？
研究它，简单地将{display: inline;}设置给浮动元素就是全部所需做的！是的，听起来太简单了，不是吗？不过这是真的，仅仅一个display的"inline"声明已经能够胜任了。
熟悉规则的人知道浮动元素自动设置为"block"元素，而不管他们之前是什么。就如Steve从W3C里指出：
9.5.1 Positioning the float: the 'float' property
"This property specifies whether a box should float to the left, right,
or not at all. It may be set for elements that generate boxes that are
not absolutely positioned. The values of this property have the following
meanings:
left
The element generates a block box that is floated to the left. Content
flows on the right side of the box, starting at the top (subject to the
'clear' property). The 'display' is ignored, unless it has the value 'none'.
right
Same as 'left', but content flows on the left side of the box, starting
at the top.
none
The box is not floated. "
这说明浮动元素上的{display: inline;}会被忽略，事实上所有的浏览器没有呈现任何改变，包括IE。但是，它不知何故让IE停止将浮动元素的边界翻倍。因而，这个修复办法可以被直接应用，而没有任何繁琐的隐藏方法。如果将来的一款浏览器决定对这个修复办法抱恙，只要把这个修复装入IE独用的Tan Hack里，细节如同IE Three Pixel Text-Jog Demo。
