css - IE8 CSS 阴影无法在父 div 上正确显示

Question

这是我的网站:http://uwf.edu/honors/thesis_submission/

在 Firefox 中，一切都非常棒。但是，在 IE8 中，阴影不会包围我容器内的底部页脚 div。

<div class = "container">
    ...
    <div style = "clear:both"></div>
    <div class = "..." id = "footer">
    </div>

</div>

关于为什么会发生这种情况的任何想法？

Answer 1

IE8 本身不支持 box-shadow CSS 属性。

我注意到您正在使用 filter 样式来实现相同的效果。

首先，对于 IE8，您应该使用 -ms-filter 而不仅仅是 filter，并将过滤器值括在引号中，如下所示:

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(color='#cccccc', Direction= 135, Strength=5)";

如果您想支持 IE6 和 IE7，您还需要保留现有的 filter 样式。

其次，我强烈建议使用像 CSS3Pie 这样的产品为了向 IE 添加对标准 CSS box-shadow 的支持。这将极大地简化您的样式表并使它们更易于维护。