Как работает контексте наложения?

Question

[Juggie]

Мне нужно сделать так, чтобы родительский блок перекрывал все дочерние элементы. То есть так, чтобы взаимодействовать с элементами можно было только в пределах родительского блока.

Для меня решение состояло в том, чтобы задать дочерним элементам отрицательный z-индекс, благодаря чему они перекрывались родительским блоком. Однако загвоздка в том, что если задать z-index и родителю в том числе, вся схема рушится, родитель перестает перекрывать дочерние элементы.

Как я понял, вопрос в контексте наложения. Перепробовал всевозможные методы, ничего не помогает. Подскажите, пожалуйста, как сделать так, чтобы родительский блок перекрывал дочерние элементы даже при наличии z-index'a?

Пример на Codepen

Comments

[oink]

А можно подробнее насчет того, что требуется достичь? Ну, в пейнте набросок, что ли.

Answer 1

[Aetae]

Это работает исключительно потому, что элемент по умолчанию не создаёт своего контекста и минусовой индекс работает в родительском.
Заверните корневой элемент в обёртку и уже обёртке назначайте нужный индекс, других вариантов по конкретному вопросу нет.

Но скорее всего вы что-то делаете не так, и описание настоящей задачи помогло бы нам дать правильный ответ.