Использование свойства position со значениями relative и absolute отличается следующим образом:

1. Relative определяет позиционирование элемента относительно его стандартного местоположения на странице. 2 При использовании этого значения можно задать дополнительные параметры, такие как top, bottom, left и right, которые указывают на смещение элемента относительно его стандартного местоположения. 2
2. Absolute задаёт точное местоположение элемента на странице, независимо от других элементов на странице. 2 Элемент позиционируется относительно ближайшего родительского элемента, который имеет позиционирование, отличное от static. 2 Если такого родителя нет, то позиционирование осуществляется непосредственно по отношению к элементу HTML (самой странице). 1

Таким образом, при относительном позиционировании элемент смещается относительно себя самого, при этом другие элементы не затрагиваются, а при абсолютном — элемент удаляется из обычного потока документа и располагается относительно ближайшего позиционированного предка, если такой есть. 5