Урок 06 · 11 хв

position і шар

static — у потоці. relative якорить absolute. fixed — до вікна. z-index не без stacking context.

За замовчуванням static. relative зсуває, але місце в потоці лишається. absolute — від найближчого предка з position не static. fixed — до в'юпорту (доки предок не зробив transform — сюрприз). sticky — як relative, доки не прилипне під час скролу.

Бейдж на картці

Можна спитати про це правило«z-index працює всередині контексту»

Модалка: fixed + оверлей. Не забувай про прокрутку body.
absolute без top/left лишається «приблизно там», але вийнятий з потоку.
Не будуй усю сторінку на absolute. Потік + flex/grid, absolute — виняток.

Можна спитати про цей пункт«Суть уроку»

Перевірка

Закріпи, поки не пішов далі

1. absolute позиціонується від
2. fixed зазвичай якориться до
3. Чому z-index: 9999 не поверх модалки?