Расскажи про CSS-свойство position: какие значения бывают и какие у них особенности?

CSS-свойство position определяет способ позиционирования элемента на странице. Основные значения:

• static — значение по умолчанию. Элемент располагается в нормальном потоке документа, игнорируя свойства top, left и т.п.

• relative — элемент позиционируется относительно своего нормального положения. Можно смещать элемент с помощью top, left, но он всё равно занимает место в потоке.

• absolute — элемент вынимается из нормального потока и позиционируется относительно ближайшего предка с позиционированием (relative, absolute, fixed). Если такого нет — относительно окна браузера.

• fixed — элемент фиксируется относительно окна браузера и не двигается при прокрутке страницы.

• sticky — гибрид relative и fixed. Элемент ведёт себя как relative до тех пор, пока не достигает заданной позиции при прокрутке, после чего фиксируется.

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

• Элементы с absolute и fixed не занимают места в потоке, что влияет на расположение соседних элементов.
• relative позволяет смещать элемент, не нарушая поток.
• sticky полезен для создания закреплённых заголовков, меню и т.п.

Пример:

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