WordPress 하위 메뉴가 표시되지 않고 대신 머리글에 스크롤 막대가 나타납니다.

Question

스크롤 막대 아래에 숨겨져있는 대신 하위 메뉴가 표시되도록 설정하고 싶지만 붙어 있습니다.

http://postimg.org/image/yqe0nz2p7/

CSS

.nav { 
    float: right; 
    display: inline-block; 
    width: auto; 
    position: relative; 
} 

.nav > ul > li { 
    margin-right: 55px; 
    overflow: visible; 
} 

.nav > ul > li > .sub-menu { 
    position: absolute; 
    padding-left: 0px; 
    background-color: #fff; 
    border-radius: 2px; 
    border: 1px solid #ddd; 
    z-index: 2; 

} 

HTML :

<nav class="nav" role="navigation"> 
        <ul><li id="menu-item-18" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-18"><a href="http://www.ubietest.ubieportal.co.uk/web-design/">Web Design</a> 
<ul class="sub-menu"> 
<li id="menu-item-992" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-992"><a href="http://www.ubietest.ubieportal.co.uk/terms/">Terms &#038; Conditions</a>  </li> 
<li id="menu-item-993" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-993"><a href="http://www.ubietest.ubieportal.co.uk/terms/">Terms &#038; Conditions</a> </li> 
</ul> 
</li> 
<li id="menu-item-772" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-772"><a href="http://www.ubietest.ubieportal.co.uk/search-engine-optimization/">Search Optimization</a> 
<ul class="sub-menu"> 
<li id="menu-item-994" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-994"><a href="http://www.ubietest.ubieportal.co.uk/terms/">Terms &#038; Conditions</a> </li> 
</ul> 
</li> 
<li id="menu-item-59" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-59"><a href="http://www.ubietest.ubieportal.co.uk/price-plans/">Price Plans</a></li> 
<li id="menu-item-58" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-58"><a href="http://www.ubietest.ubieportal.co.uk/portfolio/">Portfolio</a></li> 
<li id="menu-item-26" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a href="http://www.ubietest.ubieportal.co.uk/get-quote/">Get quote</a></li> 
</ul>     
</nav> 

Answer 1

<ul> 드롭 다운 메뉴가 포함 된 요소로 position: relative;을 설정해야합니다. 지금은 하위 메뉴가 .nav 요소에 대해 절대적입니다.

또한 .nav > ul > li에 대해 작성된 overflow: visible; 규칙이 있으므로 확인해보십시오. 그것은 수평 스크롤을 만들고, 나는 그것이 불필요하다고 생각한다.