Set responstive height for ion-list?


#1

I have interface as below.

right now, as the list gets bigger, it goes below the actual device screen bottom.

how would I make this list to
start from 30% of the view (from the top)
to 100% of the view (to the bottom) ?

<div class="modal">
    <ion-content ng-controller='SomeCtrl'>
    	<button class="button button-full button-energized" ng-click="closeRoom()">Done</button>

      	<div class="list">
        	<label class="item item-input">
          		<span class="input-label">Name</span>
          		<input type="text" ng-model="roomdata.guid">
        	</label>
        	<label class="item item-input">
          		<span class="input-label">Info</span>
          		<input type="text" ng-model="roomdata.body">
        	</label>
      	</div>

      	<ion-list>
	        <ion-item class="animate-repeat" ng-repeat="reply in infinite_replies" item="post">
  				<div class="item" on-swipe-left="">
                <!--<span ng-hide="false"><i class="ion-loading-c"></i></span>-->
	          		<p> {{ reply.body }} </p>
				</div>
	    	</ion-item>
	</ion-list>
    </ion-content>
  </div>

#2

You can try using @bengtler plugin called Ionic Scroller.


#3

@Gajotres All I’m trying to do is to make the ion list to be ideal height in Modal view.

When I do it with Modal, i think its height becomes modal’s height which will go below the bottom edge of Modal view.

Something like below