Как работает position: sticky? Когда элемент "отклеивается"?

Пример:

.sticky-element {
  position: sticky;
  top: 20px; /* Прилипает, когда расстояние до верха viewport ≤ 20px */
}

Условия работы:

1. Родитель должен иметь область прокрутки (например, overflow: auto).

2. sticky работает только внутри родителя — при прокрутке за его пределы элемент "отклеивается".

Вывод:
sticky идеален для заголовков таблиц или меню, которые должны оставаться видимыми при прокрутке.