css - div 后面的下拉菜单

标签 css wordpress drop-down-menu

我在 Wordpress 上使用 Montana 模板,我不知道为什么我的下拉菜单隐藏在主 slider 后面...

这里是测试环境的链接:http://evolutionescaperooms.com/dev/

enter image description here

即使我将 ul 标签添加到 z-index : 99999 或 position : absolute,仍然不起作用......但是如果你关闭并重新打开菜单,下拉菜单将无缘无故地位于 slider 上方...... .

有人能快速解决问题吗?

谢谢

最佳答案

这是一个溢出问题,而不是 z-index 问题。 .navigation div 的 css 中有 overflow: hidden;。这是裁剪任何溢出其边界的子元素。

当您打开和关闭导航时,它会通过 Javascript 将溢出切换到 overflow: initial。这就是为什么它只在菜单打开和关闭后才起作用。

原始 CSS:

.navigation {
    position: relative;
    display: table;
    overflow: hidden; /* Preventing overflowing popup menu from showing */
    width: 100%;
    margin-top: 40px;
    transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
}

更新为:

.navigation {
    position: relative;
    display: table;
    width: 100%;
    margin-top: 40px;
    transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
}

关于css - div 后面的下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41602927/

相关文章:

javascript - dataTables JS Plugin响应宽度溢出设置div宽度

php - 如何使用 php 或 codeigniter 生成动态 css 文件

html - 是否可以使 Font Awesome 图标大于 'fa-5x' ?

html - 无法使 CSS 子菜单显示在其父级下方

html - 在 css 中声明的图像未显示

Wordpress 图像裁剪无限

javascript - 使用按钮在 wordpress 中添加这个小的 jquery 操作

css - slider 行为不当

jQuery 使用简单的选择框过滤列表

java - 防止下拉列表选项在 SWT 中的 Windows 上滚动