隐藏在页面内容后面的主导航子菜单 - 无法弄清楚为什么

Question

主导航子菜单项显示在此 one page 的内容后面。它一定与自定义页面模板有关，但我没有看到任何干扰的 z-index 值。这不会发生在粘性 header 上，只会发生在您没有向下滚动时可见的主要 header 上。

当我将 z-index 值添加到 header 和子菜单加上 position:inherit（和其他）时，它没有帮助。违规部分以下面的代码开头。

 <div style="margin-bottom:35px;margin-top: 20px;">

Answer 1

我想不通为什么，我认为这不是 z-index 或位置的问题。可能是因为添加了所有类以及页面向下滚动时 header 重复的事实。

但这是适合您的一种解决方案。它将使 header 保持在一种状态，并且在滚动页面时 而不是 转换。我还使用 @media only screen and (min-width 1000px) 作为断点，因为那是您网站的自适应 CSS 发生变化的时候。所以我们实际上不对移动设备进行任何更改 CSS。

@media only screen and (min-width 1000px) {
.financity-header-style-plain {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
} }

而且我还注意到，在移动设备上，当您向下滚动时，您的侧边栏菜单隐藏在其他内容后面，因此将 z-index 添加到此元素：

.mm-menu.mm-offcanvas.mm-current {
z-index: 90;
}

Answer 2

呸！玩弄位置元素和 'fixed' :)

.sf-menu > .financity-normal-menu ul { position: fixed !important; }

我仅将此添加到此页面 b/c 其他页面不受影响，该问题现已在桌面和移动设备上得到解决。它被设置为：

position: absolute

这显然比我知道的要多。感谢您查看此内容！

隐藏在页面内容后面的主导航子菜单 - 无法弄清楚为什么

Main Navigation Submenu Hidden Behind Page Content - Can't Figure Out Why

css

wordpress

z-index

wordpress-theming