Какое свойство position появилось недавно

«Какое свойство position появилось недавно» — вопрос из категории CSS, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Новое свойство position: sticky стало популярным в последние годы, хотя формально оно появилось в CSS ещё в 2017 (CSS3). Оно позволяет элементу вести себя как relative, пока он находится в области видимости, а при достижении определённого края (заданного через top, bottom, left, right) "прилипает" к нему, как fixed.

Пример:

.header {
  position: sticky;
  top: 0;
  background: white;
}

Особенности:

  • Работает только внутри родительского контейнера
  • Требует указания хотя бы одного края (top, bottom и т.д.)
  • Поддержка в браузерах почти полная, кроме старых версий IE/Edge