Почему не работает z-index у before?

Question

[Zhenya Tureysky]

Есть блок с карточками в каждой карточке есть before з цифрой которая должна быть под низом самой карточки я пробовал что-то делать не получается не пойму в чем проблема

Comments

[Ankhena]

Проблема в блюре, в смысле в фильтре, потому что фильтры создают новый контекст наложения.

Читайте начиная, например, отсюда css.yoksel.ru/kontekst-nalozheniya

Answer 1

[Алексей]

Потому что при абсолютном позиционировании свойство top указывает позицию с верхнего края ближайшего родителя вниз, а если указать отрицательное значение, то будет с верхнего края вверх. Если надо относительно нижнего края вниз на всю высоту псевдоэлемента, то можно использовать, например, bottom: - высота_псевдоэлемента_px, либо указать максимальную высоту через top: 100%, что проще.

Comments

[Zhenya Tureysky]

если честно не совсем понял что нужно написать чтоб все было как мне надо

[Алексей]

Zhenya Tureysky, в вашем случае просто лучше написать
top: 100%;
вместо
top: -93px;
только row-gap больше сделать

[Ankhena]

Алексей, вопрос про z-index

[Алексей]

Ankhena, я просто вечером читаю через одно место ) думал ему вниз просто надо. а так да, все эти свойства:
filter
transform
backdrop-filter
perspective
contain
container
transform-style
content-visibility

влияют на позиционирование элементов