我知道这个问题已经被问过很多次了,但我正在开发一个 Wordpress 主题,并且我的子菜单的样式完全符合我的要求。但是,它们会在悬停时消失。我已将我所有的 margin-tops 设置为零,如之前在 Stack 上所述,但它们仍然无法正常工作。
我的这个顶部导航的 CSS 如下:
.top-nav {
background-color: #444;
min-height: 40px;
}
.top-nav ul {
margin-bottom: 0;
}
.top-nav li {
margin: 0 20px 0 0;
padding: 0;
float: left;
display: inline-block;
position: relative;
}
.top-nav li a {
color: #aaa;
font-size: 12px;
line-height: 40px;
}
.top-nav li a:hover, .top-nav li.current-menu-item a {
color: #fff;
background-color: #444;
}
.top-nav ul li ul.sub-menu {
display: none;
margin-top:0px;}
.top-nav ul li:hover > .sub-menu {
display: block;
position: absolute;
height: 0px;
margin-top:-5px;
overflow: visible;
margin-left:0px;}
.top-nav li.menu-item ul li {
display: block;
position:relative;
width: 100%;
float: left;
margin:0px;
padding:5px 0 5px 10px;
background-color:#444!important;
border-bottom: 1px solid #faf3bf;}
.top-nav ul li.menu-item ul li a {
width: inherit;
padding: 0;}
如有任何帮助,我们将不胜感激。
最佳答案
必须添加:
z-索引:1; .top-nav li.menu-item ul li
标题的 H3 覆盖了下拉列表。
关于html - 下拉菜单以零边距消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25412333/