具有较高z-index的固定div仍显示在下方

时间:2016-11-10 19:37:51

标签: css wordpress visual-composer

我已经陷入了一些我对z-index不太了解的事情。我已经阅读了很多关于z-index并不像人们可以猜到的那样直截了当所以在自己尝试了所有内容之后我会尝试指出我的问题,希望能找到解决方案!

对我而言,归结为4项使其变得复杂的事项:

1行,背景色为z-index: 0

随后滚动fixed

1 z-index: 1 div

1行,背景颜色为z-index: 2(假设它位于fixed div之上。)

1 fixed 菜单z-index: 3(假设其他所有内容都是如此)。

我的问题是我的菜单在<{1}}的​​>下面,尽管它有z index: 2,并且因为{{1 div z-index: 3我不能给它一个低于2的值!

我找到的唯一的解决方案是,如果我从fixed的行中删除任何z-index,但它会落在我的z-index: 1 之下div ,问题重演了。

如果有人想要更好地了解我的问题,这是我正在进行的工作:http://www.johnmorganstudios.se/client-sevn

1 个答案:

答案 0 :(得分:0)

尝试使用

div#top-row {
z-index: 3;

}

我认为问题是你尝试使用z-index的元素:3 on与你使用z-index的行处于同一级别:2 on或者它与之相冲突它上面元素的z-index。

如果你看看div#enhance with class .On-top-row你有z-index:2它是你的article元素的直接子元素。

但是,带有.stickyheader类的div比文章元素低2。

我看到div#top-row也有.On-top-row类,所以可能会将该类更改为.most-toppest-row with z-index:3。