Question

我在主菜单上有一个重叠的下拉菜单（将鼠标悬停在菜单按钮上）。请访问网站：

问题是，如果我在子菜单中添加一个上边距，它看起来很棒，但是当我鼠标拖出主导航项时它会消失。要查看我的意思，请尝试使用firebug或chrome进行检查，并在子菜单中添加margin-top：2em，如下所示。欢迎任何有关解决方案或解决方案的想法！

.sub-menu {
position: absolute;
top: 100%;
left: 50%;
display: none;
min-width: 170px;
background-image: url('http://add-ocd.com/gustazoscafe/wp-   content/uploads/2015/06/headerbackground.png');
text-align: center;
background: white;
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
background-image: url('http://add-ocd.com/gustazoscafe/wp-content/uploads/2015/06/headerbackground.png') !important;
transform: translateX(-50%);
margin-top: 2em;
}

Answer 1

试试这个并告诉我你的反馈意见。

nav > ul > li.menu-item{
  margin-bottom: -2px;
}
.nav--main > .menu-item > a{
  padding-bottom: 25px;
  padding-top: 25px;
}

如何在下拉菜单中添加边距而不会失去向下滚动的功能

1 个答案: