摆脱手机下拉菜单中的滚动条

Question

Hi I am trying to figure out how to get the scroll bars to not show on the drop down menu that shows up on this page when in mobile view.

[It is asking me for more details before I post and I don't have any except to say that I added some some javascript to this page and jQuery but removed it and had the same problem so I do not think that is it]

Mobile Nav CASS

#nav_desktop{
    display: none;
}

#nav_mobile{
    display: block;

}

#nav_mobile ul
{
    list-style:none;
    position:relative;
    float:left;
    margin:0;
    padding:0;
}

#nav_mobile ul a
{
    display:block;
    background-color: #4A4949; 
    color:#ffffff;
    text-decoration:none;
    font-size: 18px;
    padding:0 15px;
    font-family: 'Handlee', cursive;

}

    #nav_mobile ul a:hover{
        color:#f09000;
    }

#nav_mobile ul li
{
    position:relative;
    float:left;
    margin:0;
    padding:0;
}

#nav_mobile ul li.current-menu-item
{
    background:#ddd;
}

#nav_mobile ul ul
{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:#fff;
    padding:0;
}

#nav_mobile ul ul li
{
    float:none;
    width:200px;
}

#nav_mobile ul ul a
{
    line-height:75%;
    padding:10px 15px;
}

#nav_mobile ul li:hover > ul
{
    display:block;
}

Nav HTML

 <nav id="nav_desktop"> 

    <ul>
        <li><a href="template_test.html">Home</a></li>
        <li><a href="#dt">Downtown Tour</a></li>
        <li><a href="#gt">Growth Tour</a></li>
        <li><a href="#lt">Landmarks Tour</a></li>
        <li><a href="#ct">Contact</a></li>
    </ul>

</nav>

<nav id="nav_mobile"> 

<ul>
    <li><a href="#">Menu</a>
        <ul>
        <li><a href="template_test.html">Home</a></li>
        <li><a href="#dt">Downtown Tour</a></li>
        <li><a href="#gt">Growth Tour</a></li>
        <li><a href="#lt">Landmarks Tour</a></li>
        <li><a href="#ct">Contact</a></li>

</ul>
</ul>


</nav> 

Answer 1

You need to make some changes in your classes like as below -

#nav_mobile ul ul {
    background: #fff none repeat scroll 0 0;
    display: none;
    left: 0;
    padding: 0;
    position: absolute;
    top: 24px; <!-- change this to 24px -->
}

#nav_mobile ul li {
    float: left;
    margin: 0;
    padding: 0;
    <!-- position: relative; (remove it) -->
}

#nav_mobile ul {
    float: none;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    <!-- position: relative; (remove it) -->
}

Answer 2

you have to give the ul element a display attribute and do not let it float:

#nav_mobile ul{
    float:none;
    display:inline;
}

now you should see the whole menu!