I want to insert element inside <ion-segment-button> and make it to the top. However z-index:9999 is not working. Am I missing something or it's a bug?

          <ion-segment-button
          class="test">
          <ion-icon name="document-text"></ion-icon>
          <ion-label>{{ 'label-SurveyDistributionLogs' | translate }}</ion-label>
          <div id="helpParent" (click)="test2()" style="
              background: red;
              width: 200px;
              height: 200px;
              z-index: 999999;
          "><i id="helpChild" (click)="test2()" class="far align-vertically fa-question-circle"
              style="cursor: pointer;width: 24px;height: 24px;font-size: 20px;color: rgb(6, 54, 85);margin-left: 10px;z-index: 9999;"></i>
          </div>
          </ion-segment-button>

Wanted to make red div clickable before ion-segment.
image

type or paste code here