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

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -