CSS在所有Windows浏览器中都可以正常工作，但在OSX上的Firefox中则不行

Question

我有一些CSS，它在Windows上工作正常，但是当我在OSX上查看它时，它并不完全正确。

这就是它应该看起来的样子，很棒：

这就是OSX上的Firefox 15显示它的方式：

CSS：

nav#main ul>li.current {
height: 59px;
}

nav#main ul>li.current:before {
background: url('../img/top_shadow.png') no-repeat;
content: '';
display: block;
height: 7px;
margin: -7px 0 0 0;
}

nav#main ul>li.current:after {
background: url('../img/bottom_shadow.png') no-repeat;
content: '';
display: block;
height: 7px;
margin: 8px 0 0 0;
}

nav#main ul>li.current a {
background-color: #77b9de;
color: #3e3e3e;
height: 53px;
margin: -4px 3px -8px -3px;
padding: 3px 3px 0 10px;
}

有关为何发生这种情况的任何想法？我也应该指出，如果我将背景颜色移到<li>而不是<a>，它仍然会相同。

http://jsfiddle.net/eHhGa/

我在jsfiddle中添加了一个快速版本，以查看整个代码的外观。

Answer 1

我解决了这个问题，当浏览器高度低于500px并且firefox严格要求时，overflow:hidden;基本上正在容器上生效。