Ion-select not working with ion-tabs

I was planning to use ion-tabs as a decorative element in my application, w/o its router integration. However, putting it on the same page with other elements was breaking those elements. For example ion-select stopped working completely – no dropdown was available.

I found the following solution: the ion-tabs block should be placed inside ion-footer, like this:

<ion-content>
  Any code will work here, for example ion-select.
</ion-content>

<ion-footer class="ion-no-border">
  <ion-toolbar>
    <ion-tabs>
      <ion-tab-button>
        ...
      </ion-tab-button>
    </ion-tabs>
  </ion-toolbar>
</ion-footer>

Leave a Comment