Pozycjonowanie elementów i z-index

Wartości właściwości position:

• static – domyślne położenie w normalnym przepływie dokumentu. Właściwości top, left, z-index są ignorowane.
• relative – przesunięcie elementu względem jego normalnego położenia (rezerwuje pierwotne miejsce w dokumencie).
• absolute – wyjęty z normalnego przepływu dokumentu; pozycjonowany względem najbliższego przodka z pozycją inną niż static.
• fixed – wyjęty z przepływu; pozycjonowany względem okna przeglądarki (viewportu) – nie przesuwa się podczas przewijania strony.
• sticky – hybryda relative i fixed; przykleja się do krawędzi podczas scrollowania po osiągnięciu określonego progu.

.karta-rodzic {
    position: relative; /* Punkt odniesienia dla dziecka */
    width: 300px;
    height: 200px;
}

.znaczek-promocja {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10; /* Wyświetlanie nad zdjęciem */
}

Najczęstsze pułapki na egzaminie INF.03:

• z-index działa wyłącznie na elementach, które posiadają zdefiniowaną właściwość position różną od static!