Ρύθμιση της στοίβαξης στοιχείων στον άξονα Z στο CSS

Η σειρά στοίβαξης των στοιχείων μπορεί να ρυθμιστεί χρησιμοποιώντας την ιδιότητα z-index, που δέχεται ως τιμή του θετικούς ή αρνητικούς ακέραιους αριθμούς, ή το μηδέν. Η ιδιότητα λειτουργεί μόνο για στοιχεία των οποίων η τιμή position ορίζεται ως absolute, fixed ή relative.

Όταν χρησιμοποιείται αυτή η ιδιότητα, ο κανόνας στοίβαξης των στοιχείων είναι ο εξής: πιο πάνω θα είναι εκείνο το στοιχείο που έχει την υψηλότερη τιμή z-index.

Ας αλλάξουμε τη σειρά στοίβαξης των στοιχείων από το προηγούμενο παράδειγμα. Για αυτό, στο πρώτο στοιχείο θα ορίσουμε z-index μεγαλύτερο, από αυτό του δεύτερου, για παράδειγμα, έτσι:

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

Αποτέλεσμα εκτέλεσης του κώδικα: