Question

我一直在试图弄清楚如何让我的链接在分层div中工作

我有一个包含两个其他div的大div：

主要div与内容和
我菜单的导航div

问题是main div与导航div重叠，其中我希望我的链接是（色带），这样看起来它们在悬停时被拉出。但它们根本不是活跃的链接？我的css如下：

    .navigate {
    width: 1020px;
    height: 300px;
    position: absolute;
    right: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    top: 190px;
    z-index: -1;
    border: 1px solid red;}

和

.main {
background: url("../images/papir.png") no-repeat center; /* papir.png bredde=1020px */ 
margin-left: auto;
margin-right: auto;
margin-top: 150px;
margin-bottom: 7em;
width: 1020px; /* 1020px */
height: 752px; /* 752px */ 
z-index: 0;
border: 1px solid green; }

就像navigation div背后的东西：$

当我在z-index中将navigation div更改为0时，它工作得很好，除了div不在main div之后..

我试图用

修复它

body {
position: relative;
z-index: 0; }

在某处读到它应该解决问题 - 但不适合我

有任何想法如何解决？

提前致谢

Answer 1

目前，您将.navigate div z-index设置为-1，因此它位于.main div之后。使它比其他div更大，所以它在顶部。例如。 z-index: 101;

Answer 2

搞定了！

刚补充说：

position: relative;

到.main-div

Answer 3

当我在导航div中将z-index更改为0时，它的工作正常，只是div不在主div之后。

如果我理解正确，如果在链接顶部有另一个div重叠，则无法获得链接。如果导航div位于主div下，导航div上的链接将无效

，但..

如果你想要带有顶部链接的div - 将它们设置为相对或绝对或固定，并将z-index设置为比你想要的div更高的任何数字

Answer 4

为你想要覆盖的div使用负边距，例如

.overlay-div{margin-top:-20px;}

链接在分层div中不起作用

4 个答案: