html - Box Shadow 在 Chrome 中有效，但在 IE 和 Firefox 中无效

Question

我编写了一个用于特定元素的框阴影，它在 Chrome 中运行良好，但在 Firefox 和 Internet Explorer 中不起作用。我的网站有三个 div(页眉、正文、页脚)，它们适用于 Chrome 和 Firefox，另外两个很好。

这是我的代码:

#footer {
background-image:url(../../images/footer-extend.png);
background-repeat: repeat-x;
width: 960px;
border-bottom: 1px solid black;
border-left: 1px solid black;
border-right: 1px solid black;
overflow:hidden;
padding-top: 35px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 0px;

margin:0 auto;
margin-top: -10px;
margin-bottom: 100px;
/* BOX SHADOW */

-moz-box-shadow: 6px 0 6px  -4px #222, -6px 0 6px  -4px #222, 0px 6px -4px #222;  
-webkit-box-shadow: 6px 0 6px  -4px #222, -6px 0 6px  -4px #222, 0px 6px -4px #222;
box-shadow: 6px 0 6px  -4px #222 , -6px 0 6px  -4px #222, 0px 6px -4px #222; 
}

Answer 1

您的 box-shadow 在最后一个声明中使用负值作为 blur。您是否可能遗漏了什么并且想使用负模糊作为传播？

我猜 Firefox 不支持负模糊，这似乎是合法的，因为这没有任何意义。

试试这个(记得也将它应用于前缀版本):

box-shadow: 6px 0 6px -4px #222, -6px 0 6px -4px #222, 0 6px 0 -4px #222;