메뉴 폴더 여백 조정

Question

마우스를 가져 가면 아래로 떨어지는 폴더가 있지만 기본 탐색에 대해 위로 밀리지 않도록 드롭 다운에 20px 여백을 둡니다. 그러나 간격을 좋아하지만 마우스를 움직이면 하위 메뉴가 사라지고 메뉴가 사라집니다.

사용자가 드롭 다운의 여백을 조정하여 사용자가 아이템을 선택할 수있게하려면 어떻게해야합니까?

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

to .main-navigation ul li