Невозможно расположить предметы, прикрепленные внутри ковриков

Question

Я пытаюсь расположить мое изображение как липкое с

 position: -webkit-sticky;
 position: sticky;
 top: 1px;

, но не могу этого достичь.

HTML:

<mat-tab-group class="user-tabs"
    (selectedTabChange)="changeUserTab($event)">
  <mat-tab label="Selectable Tasks">
    <mat-tab-group class="user-chats"
        (selectedTabChange)="changeChatTab($event)">
        <mat-tab *ngFor="let chat of userData.chats; let i = index;">
           <img>
        </mat-tab>
    </mat-tab-group>
  </mat-tab>
</mat-tab-group>

У меня есть вкладки внутри вкладок, да.У кого-нибудь есть какое-то решение для этого?Спасибо.

Answer 1

Нашли причину - она ​​не будет работать, когда хотя бы у одного из родителей overflow установлено hidden, и это имеет место с mat-tabs.

Answer 2

Пожалуйста, попробуйте положение: исправлено и добавьте z-index: 999, если необходимо.