Reglarea suprapunerii elementelor pe axa Z în CSS

Ordinea suprapunerii elementelor poate fi reglată cu ajutorul proprietății z-index, care acceptă ca valori numere întregi pozitive sau negative, sau zero. Proprietatea funcționează numai pentru elementele care au valoarea position setată ca absolute, fixed sau relative.

La utilizarea acestei proprietăți, regula de suprapunere a elementelor este următoarea: va fi mai sus acel element care are valoarea z-index mai mare.

Să schimbăm ordinea de suprapunere a elementelor din exemplul anterior. Pentru acesta, primului element îi setăm z-index mai mare, decât al doilea, de exemplu, astfel:

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

Rezultatul executării codului: