top

Определяет верхнюю вертикальную позицию элемента. Работает в паре со свойством position.

Для position: relative происходит смещение от изначальной позиции элемента.
Для position: absolute и position: fixed смещение относительно родительского блока.
Для position: sticky смещение работает сначала как для relative, но при прокручивании фиксируется как fixed.
Для position: static не работает.

Если задано одновременно свойство top и bottom:

Для position: absolute и position: fixed будут учитываться оба свойства, если высота не задана
Для position: relative свойство bottom будет проигнорировано.
Для position: sticky будет проигнорировано.

Примеры

Значение	Описание
auto	По умолчанию. Блок не перемещается или зависит от значения `bottom`, если оно задано.
расстояние	Расстояние от верхнего края в px, em и других единицах измерения. Допустимы отрицательные значения. Например: `top: 10px;` `top: -.3em;` `top: 0;`
проценты	Расстояние в процентах от высоты родительского блока. Например: `top: 5%;`
inherit	Наследует значение родительского блока.
initial	Устанавливает значение по умолчанию.

НастольныеМобильные

Chrome

Edge

Firefox

Opera

Safari

Chrome

Firefox

Opera

Safari

Samsung

Android

top

1.0

≤37

Поддерживается: Да