Question

我有一个文件夹，当你将鼠标悬停在该文件夹上时会下降，但是我已经在下拉列表中放置了一个20px的margin-top，因此它没有被推到主导航上。我喜欢间距但是当您移动鼠标去选择子项时，菜单会消失。

您如何调整下拉的边距以使其保持不变，以便用户可以选择其中的项目？

> ul {
        display: none;
      }


      &:hover > ul {
        display: block;
        position:absolute;
        text-align: left;
        z-index:1000;
        background-color:@nav-folder-bg-color;
        width:150px;
        padding: 10px;
        list-style: none;
        border-radius:@nav-border-radius;
        margin-top:20px;

        > li a {
            color:black;
            font-size: .8em;
            text-decoration: none;
        }

      }

编辑：这是我正在处理的菜单 - http://menudemo.squarespace.com/home

Answer 1

将边距放在子菜单中的第一个LI上：

&:hover > ul li:first-child {
   margin-top:20px;
}

Answer 2

需要添加

  height:50px;

到.main-navigation ul li

调整菜单文件夹边距

2 个答案: