css - 溢出 :hidden messing with margins in Chrome and Safari

Question

我已经为我的布局设置了一些 div，一个主 div 和一个菜单 div。

它们在 Firefox 中看起来很完美，但由于某种原因，Chrome 和 Safari 却变得一团糟。

由于某些原因，当 overflow:hidden; 被添加到 CSS 时，div 的宽度变小了。不过，我需要 overflow:hidden;，因为我在主 div 中还有其他 float 。你可以在这里看到这个例子:

http://jsfiddle.net/kR7rs/2/

它在 Firefox 中显示良好，但在 Safari 和 Chrome 中，div 的右侧也有空白。

Answer 1

从 main 中移除边距似乎可以解决这个问题:

http://jsfiddle.net/kR7rs/3/

我认为发生的事情是当 overflow:hidden 被设置时，整个元素环绕在浮点周围而不是 div 中的文本。所以这给出了 fiddle 的结果。然后，如果您在其上也设置了边距，则宽度会因左侧填充而进一步减小。

有点像错误。

(现在没有FF来测试一下，看看它是否为FF打破它。)