Popout das Kind von Elternüberlauf: scroll

Question

Ich habe mit diesem Problem zu kämpfen. Ich habe eine vertikale Menüliste, die in einem div mit Überlauf ist, der auf 'scroll' eingestellt ist (ich versuchte es auch mit Auto). Wenn ich über einen Eintrag im Menü mit der Einstellung (Überlaufsatz zum Scrollen) gehe, werden die Menüwerte nicht angezeigt. Hier ist das Bild, wie es angezeigt wird.

Hier ist der Code für die oben genannte Situation. Hier Not Working

ist der CSS-Teil des Codes, der eine Menge Ärger verursacht:

  .sidebar{ 
        position: absolute; 
        top: 0px; 
        right:0px; 
        text-align: center; 
        font-family: 'Roboto','sans-serif'; 
        line-height: 30px; 
        padding-left: 10px; 
        z-index: 10; 
        float:right; 
        margin-right:20px; 
        height: 100px; 
        //overflow:scroll; //This is the code to be changed 
      } 

      .sidebar ul{ 
       z-index:25; 
      } 

      .insideul{ 
       overflow: scroll; 
      } 

      #mainist li{ 
       z-index:50; 
      } 

Hier ist das Arbeitsbild.

Hier ist der Arbeitscode, wenn ich den Überlauf entfernen. working

Kann mir jemand mit dem obigen Fehler helfen. Danke.

Answer 1

Ich kommentieren nur die Überlauf-X: Auto und Überlauf-Flow: Auto in der .sideBar-Klasse, es funktioniert.

https://jsfiddle.net/3z8mq4k3/1/

.sidebar{ 
       position: absolute; 
       top: 0px; 
       right:0px; 
       text-align: center; 
       font-family: 'Roboto','sans-serif'; 
       line-height: 30px; 
       padding-left: 10px; 
       z-index: 10; 
       float:right; 
       margin-right:20px; 
       height: 700px; 
       /*overflow-x: auto; 
       overflow-y: auto;*/ 
     }