投影以扩展元素的整个宽度

Question

如何获得投影以扩展元素的整个宽度。这就是我现在所拥有的，但我不能在横向元素上横向扩散 正如您可以在图像的右侧和左侧看到的那样，阴影是插入的，我需要它跨越整个宽度。

box-shadow: 0 8px 6px -6px black;

Answer 1

你的负扩散半径导致了这种情况。将-6px更改为某个正值：

box-shadow: 0 8px 6px 6px black;

<强> jsFiddle example

根据MDN：

  

正值会导致阴影   为了扩大和扩大，负值将导致阴影   收缩。如果未指定，则为0（阴影将相同   大小作为元素）。

Answer 2

不要使用-6px让它在0px，也不要忘记其他浏览器。

-webkit-box-shadow: 0 8px 6px 0 #000000;
-moz-box-shadow: 0 8px 6px 0 #000000;
box-shadow: 0 8px 6px 0 #000000;