Ответ
Z-Index работает только для позиционированных элементов (position: absolute, relative, fixed, sticky).
Значение должно быть целым числом (можно отрицательное).
Ограничения:
- Максимальное значение зависит от браузера (обычно
2^31 - 1). - Элементы в одном контексте наложения сравниваются по Z-Index.
- Если Z-Index не задан, порядок определяется порядком в DOM (последний элемент выше).
Пример:
.parent { position: relative; z-index: 1; }
.child { position: absolute; z-index: 10; } /* Будет выше .parent */Если элементы в разных контекстах (например, разные position: relative родители), их Z-Index сравнивается только внутри своего контекста.
Ответ 18+ 🔞
А, ну это же классика, блядь! Z-Index, сука! Ну, слушай сюда, сейчас разжую.
Этот ваш z-index — он как волшебный пендель, который решает, кто из элементов на странице будет сверху, а кто в самом низу, под всеми, как последняя мразь. Но есть один нюанс, ёпта! Он работает ТОЛЬКО с теми элементами, которые, блядь, позиционированы. То есть им прописано position: absolute, relative, fixed или этот новый, sticky. Если у элемента position: static (а это по умолчанию), то можешь хоть z-index: 9999999 ему впихнуть — нихуя не выйдет, он будет игнорировать это, как кот игнорирует команды.
Само значение — целое число. Можешь поставить 10, можешь -1 (чтобы спрятать за всё, хитрая жопа), можешь 0. Теоретический потолок — огромный, 2^31 - 1, но если ты до него докрутил, у тебя уже другие проблемы, поверь.
Вот смотри, примерчик, чтобы въехать:
.parent { position: relative; z-index: 1; }
.child { position: absolute; z-index: 10; } /* Этот мелкий пиздёныш будет ВЫШЕ родителя! */Но главный подвох, от которого все ебут мозг, — это контексты наложения, ёбана! Представь себе два брата-алкаша, каждый в своей квартире (position: relative). У одного в квартире сын (child) с z-index: 1000. У другого — дочь с z-index: 1. Так вот, они, эти дети, нихуя не могут драться между собой через стенку! Их z-index сравнивается только внутри их собственной квартиры-контекста. Дочь с z-index: 1 будет всегда выше своего отца, но никогда не сможет быть выше сына из соседней квартиры, даже с его z-index: 1000. Всё решает то, чей родитель-брат-алкаш выше в общем порядке DOM.
Короче, если z-index не работает, первым делом смотри, блядь, на position. А потом уже начинай подозревать эти ебучие контексты. Волнение ебать, но разобраться можно.