title: How to open modal behind ion-tabs [ IONIC 4 ]
body: <p>How can I show the modal behind the tabs?
  Currently the modal overlaps everything even though the z-index is set to 2 and the z-index of the tabs is set to 5.</p>
  <p><a href="https://i.stack.imgur.com/DTjU2.png" rel="nofollow noreferrer">How it currently is</a></p>
  <p><a href="https://i.stack.imgur.com/IHinl.png" rel="nofollow noreferrer">How I want it to be</a></p>
  <p>I have been trying to use z-index, however it doesn't work on the modal. Here's the code:</p>
  <p><em><strong>Modal creation</strong></em></p>
  <pre><code>const modal = await this.modalController.create({
    showBackdrop: false,
    backdropDismiss: true,
    component: CreateExpenseComponent,
    cssClass: &quot;createExpenseModal&quot;,
  });
  return await modal.present();
  </code></pre>
  <p><em><strong>Modal CSS (global.scss)</strong></em></p>
  <pre><code>.createExpenseModal {
    position: absolute;
    z-index: 2 !important;
    //--backdrop-opacity: 0 !important;
    .modal-wrapper.sc-ion-modal-ios,
    .modal-shadow.sc-ion-modal-ios {
    z-index: 2;
    position: absolute;
    top: 35rem;
    }
   }
  </code></pre>
  <p><em><strong>Ion tabs css</strong></em></p>
  <pre><code> ion-tabs {
    z-index: 5;
    position: relative;
   }
  </code></pre>
  <p>Thank you for your time!</p>