Activer le parchemin dans la position du code: fixe; dans css

Question

J'ai une page où j'ai réparé le menu sur la droite. Je veux que cette section défile quand elle est pleine. J'ai essayé cela et c'est impossible pour moi, alors j'ai besoin de votre aide.
Remarque: à partir du débordement-y: faites défiler; Je l'ai utilisé mais je n'ai eu aucun résultat.
Y at-il une solution à ce problème que je peux appliquer à la section fixe et voir le reste?

.cbp-spmenu { 
 
    background: #47a3da; 
 
    position: fixed; 
 
}

<nav class="cbp-spmenu" id="cbp-spmenu-s2"> 
 
    <h3>Menu</h3> 
 
    <ul> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    </ul> 
 
</nav>

Answer 1

Le problème est que le menu a une hauteur sans restriction, donc peu importe la taille que vous faites le contenu, il ne sera jamais complet! Bien sûr, il deviendra plus grand que la fenêtre, mais cela n'a pas d'importance pour un élément fixe. Solution: donnez au menu une hauteur maximale, dont la taille peut être celle que vous voulez. Dans mon exemple, c'est la hauteur du corps.

body, html { 
 
    height:100%; margin:0; /* to make sure we know how much 100% is */ 
 
} 
 

 
.cbp-spmenu { 
 
    background: #47a3da; 
 
    position: fixed; 
 
    max-height:100%; 
 
    overflow:auto; 
 
    padding-right:2em; 
 
}

<nav class="cbp-spmenu" id="cbp-spmenu-s2"> 
 
    <h3>Menu</h3> 
 
    <ul> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    <li><a href="#home" class="scroll">Home</a></li> 
 
    </ul> 
 
</nav>