css - IE CSS 存在负边距时背景被剪切的问题

Question

这是有问题的网站

http://kryptodesigns.com/dev/forum.php?styleid=3

在 FF、Chrome 中一切看起来都很好，请注意导航中的论坛链接以及红色背景如何扩展到灰色导航容器之外。

现在在 IE 中查看相同的链接，它会切断导航容器外部整个边距的背景颜色。

我在谷歌上到处寻找有类似问题的人，但没有运气。

这是我正在谈论的内容的图片。

任何有关解决此问题的帮助都会很棒。

感谢您的帮助!

Answer 1

问题出在此处的过滤器:

#navtabs {
    /* for non-css3 browsers */
    background: #CDCFD0 url(kryptodesigns/KD0010/misc/navigation/navigation-repeat.png) top left repeat-x;
    /* for IE */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CDCFD0');
    /* for webkit browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CDCFD0)); 
    /* for firefox 3.6+ */
    background: -moz-linear-gradient(top,  #FFFFFF,  #CDCFD0); 
}

使用过滤器会导致overflow:hidden式的效果，这就是为什么li的顶部看不到的原因.

要解决此问题，我建议您只需删除过滤器，因为您已经拥有相同渐变的图像版本。