Michal Foksa Michal Foksa - 1 year ago 161
CSS Question

Ionic: Enable scroll in inset list

Is there a way to achieve scrolling of a list (

) which is inside a
element so that it does not occupy whole screen? As shown on the image bellow:

enter image description here

For example list in a modal window is "scroll-able", but I cannot find a key to enable scrolling the list inside
<div class=my-inset>


<ion-content scroll="false">
<div class=my-inset>
<ion-item ng-repeat="item in items">
Item {{ item.id }}.


position: absolute;
top: 20px;
left: 15%;
width: 70%;
height: 200px;
border: solid;

CodePen example.

Answer Source

The simplest way I could recommend would be to change your CSS Overlay property on your .my-inset class. To fix it, I applied an overlay-x and overlay-y instead of just a single overlay, and set the overlay-y to "scroll". overflow-y: scroll; overflow-x: hidden;

I hope that helps!

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download