Menu verticale a comparsa non scorre

[Tom1884]

Nella versione mobile del mio sito, il menu a comparsa (attivato/disattivato dal tasto a tre linee orizzontali) non può essere scorso.
Scorre sempre il contenuto "sottostante", pertanto, se il menù si allunga con l'apertura di sottocategorie, le voci più in basso sono irraggiungibili.
Come posso fare in modo che il menu, se aperto, sia scrollabile?

Questo il css:

.main-nav {
    padding: 0;
    margin: 0;
    margin-top: 50px;
    width: 100%;
    position: fixed;
    text-align: center;
    z-index: 1000;
}

[stoneweb]

Ciao, potresti usare un "overflow-y: auto" sugli ul che fanno da sottomenu, ma ricordati che per funzionare l'overflow l'ul o div deve avere un'altezza fissa, es: width: 300px;

[Tom1884]

Ottimo, grazie!

2 cose, di contorno:
1- come mai suggerisci di lavorare sugli <ul> e non sul div generale main-nav? Qualche vantaggio?
2- vedo che, terminato lo scorrimento del menu che compare sopra alla pagina, lo scorrimento continua a coinvolgere la pagina sottostante. C'è un modo per bloccare in assoluto lo scroll della pagina finchè il menu è aperto?

[stoneweb]

1 - Nessun vantaggio che mi venga in mente, semplicemente pensavo volessi che scrollasse solo l'ul del submenu
2 - Che mi venga in mente così a brucio potrebbe starci un js che dica se il main-nav è aperto non scrollare il body. Ho visto che il sito usa jquery quindi potresti mettere qualcosa del genere:

$(window).scroll('click', function() { 
   if($('.main-nav').hasClass('mobile_in')) { 
      $('body').css('overflow','hidden'); 
   } else { 
      $('body').css('overflow','auto'); 
   } 
})