菜单链接在父阴性z-index容器中不可点击。

Question

我需要设计像图像一样的菜单。到目前为止，我已经通过边框半径和负图层实现了它，但是无法单击第四个和第五个菜单项。需要你的建议。这是DEMO

要实现的菜单设计：

Answer 1

我通过向类中添加以下属性来解决问题。由于“第三菜单”位于所有菜单（图层）的顶部，“第二菜单”和“第四菜单”位于同一级别。类似地，“第一菜单”和“第五菜单”也具有相同级别的层。在这里，我是如何实现它的。

.menu div.three{
    position: relative;
    z-index: 3;
}
.menu div.four{
    position: relative;
    z-index: 2;
}
.menu div.five{
    position: relative;
    z-index: 1;
}

以下是更新后的DEMO