Html 一个div上的CSS框阴影被其他div隐藏

我有两个盒子，它们是垂直堆放的。我希望顶部div的底部边缘有一个长方体阴影。顶部框的阴影隐藏在底部框的后面

如何修复此问题？

您可以使用：

或者

#first{
    position:relative;
    z-index:2;
}

或

PS：对于前面的回答错误，我深表歉意示例如下：

---

祝你好运

或者只需在顶部div中添加一个边距底部：10px或其他东西

它应该是

位置：相对的

，而不是

绝对的

，并且不需要如此高的

z指数

。当然可以，这里有一个JSFIDEL显示这两个选项，祝你好运-。我更新了答案以符合您的要求@Donnyptanks Luis-非常全面的答案bt我只有1票：）谢谢。为什么需要

position:relative

<代码>位置：绝对，

位置：相对

，

位置：固定

或

位置：粘性

对长方体阴影的效果相同，但对长方体本身的效果不同。对于任何其他

位置：

将不应用z索引。这将向下推动底部div，我高度怀疑这是期望的行为。无法向下推动底部框

#second{
    margin-top:10px;
}