css - 调整菜单文件夹边距

Question

我有一个文件夹，当您将鼠标悬停在它上面时会下拉，但是我在下拉列表中放置了一个 20 像素的边距顶部，这样它就不会向上推到主导航栏上。我喜欢间距，但是当您移动鼠标去选择一个子元素时，菜单会消失。

您将如何调整下拉菜单的边距以使其保持不变，以便用户可以在其中选择一个元素？

> 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;
}