ein Kind div innerhalb eines übergeordneten div y-scrollbaren Machen, wenn das Kind zu groß wird

Question

Hier ist mein Problem, es ist ziemlich ungewöhnlich, so ist dies, warum ich hier die Frage stellen:

Ich habe ein Elternteil div, middle genannt (die ist selbst in einem übergeordneten div namens row, seine Höhe ist auf 315px). Diese middle enthält zwei Divs, div1 und scrollable_div.

div1 hat eine bestimmte Höhe, die nicht geändert werden soll. Auf der anderen Seite enthält die scrollable_div eine Liste, die entwickelt werden soll (durch JavaScript-Methode), was bedeutet, wenn die Liste zu viele Elemente enthält, wird es sich überlappen und einige verrückte Sachen tun, sobald die Liste die Höhe der Zeile erreicht . Ich möchte eine Schriftrolle, um diese gut aussehende Seite nicht völlig zu zerstören, wenn die Liste zu groß wird.

Hier ein codepen: http://codepen.io/Yocto/pen/qZXQjm wo elname steht für Element nennen. (row1 hat einen violetten Hintergrund und die nicht scrollbare Liste hat eine orangefarbene).

Zögern Sie nicht, mir zu sagen, wenn was ich will, ist nicht ganz verständlich.

Answer 1

einfach eine Höhe für die scrollbaren div gesetzt und dann die y-Überlauf Eigenschaft ....

Updated CodePen

.scrollable_div { height:130px; overflow-y:scroll;}