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); 
}

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

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