Řízení překrývání prvků podél osy Z v CSS

Pořadí překrývání prvků lze regulovat pomocí vlastnosti z-index, která přijímá jako hodnotu celá kladná nebo záporná čísla, nebo nulu. Vlastnost funguje pouze pro prvky, jejichž hodnota position je nastavena jako absolute, fixed nebo relative.

Při použití této vlastnosti je pravidlo překrývání prvků následující: výše bude ten prvek, jehož hodnota z-index je větší.

Pojďme změnit pořadí překrývání prvků z předchozího příkladu. Pro toho prvnímu prvku nastavíme z-index větší, než u druhého, například takto:

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

Výsledek provedení kódu: