Регулирование наложения элементов по оси Z в CSS

Порядок наложения элементов можно регулировать с помощью свойства z-index, принимающего своим значением целые положительные или отрицательные числа, либо ноль. Свойство работает только для элементов, у которых значение position задано как absolute, fixed или relative.

При использовании данного свойства правило наложения элементов следующее: выше будет тот элемент, у которого значение z-index больше.

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

css#elem1 {
  z-index: 2;
}
#elem2 {
  z-index: 1;
}

Результат выполнения кода: