css - 100% height in ion-slide-box not working -
i'm using ion-slide-box in application. height of content slide not filling whole content. means have blank space @ bottom of slide. in scenario user should able slide when swipes blank space @ bottom. however, not working since size of ion-slide not 100%. i'm not able set size 100%. tried following:
.slider{ height:100%; } .slider-slide { height: 100%; min-height:100%; }
using above code slide content still not 100%. thank help. html slide-box:
<ion-content> <ion-slide-box class="slider" on-slide-changed="slidechanged($index, this)" show-pager="false" active-slide="1" ng-init="handleslideenabling()" does-continue="true"> <ion-slide class="slider-slides" ng-repeat="question in questions"> <div class="slider-slide"> ... content </div> </ion-slide> </ion-slide-box> </ion-content>
this hacky solution, can create custom css container 100vh use on views know less 100vh.
.slider { height: 100%; } .slide-container { height: 100vh; // height: calc(100vh - 43px) if have header bar 43px tall }
then html can this
<ion-slide-box on-slide-changed="vm.slidehaschanged($index)"> <ion-slide> <div class="slide-box"> // content less 100vh </div> </ion-slide> <ion-slide> // content more 100vh </ion-slide> </ion-slide-box>
Comments
Post a Comment