Bootstrap:Fixed nav-static-top on top but scrollable nav-collapse

Question

I am using bootstrap to design my site.

Base on this fiddle

I made the nav-static-top to fixed on top. Now the nav-collapse has to many contents and i can't browse to the last menu because the nav-static-top is fixed on top. Is there a way that the nav-static-top is fixed on top and the nav-collapse content is scrollable so i can scroll to choose on the content?

i've than something like this but i doesn't look good and i think android devices don't support overflow:scroll

Answer 1

Found a better way. Tested on iphone 4 only.

@media (max-width: 767px) { 
.body-container {
    padding-top: 50px;
    margin-left:10px;
    margin-right:10px; 
}

.navbar-static-top{
    position:fixed;
    width:100%;
    z-index:1000;
}
.navbar-responsive-collapse{
    max-height: 350px;  
        overflow-y: auto; 
        -webkit-overflow-scrolling: touch; 
    }

}