Czym różni się position relative od absolute?


(janusz_pro) #1

Witam

Czy można w kilku zdaniach wyjaśnić czym się różni position relative od absolute? W internecie jest masę materiału ale jednoznacznej odpowiedzi nie widzę.


(lordjahu) #2

Pozycjonowanie relative
Elementy z position:relative. Możemy przesunąć element w dowolnym kierunku od miejsca w którym by się znalazł domyślnie.
Możliwości przesunięcia to top, bottom, left, right. Jeśli przesuniemy element nadając mu top:10px to element przesunie się o 10px w dół. Zajmuje on miejsce tam gdzie powinien być domyślnie wyświetlany a pokazywany jest w innym miejscu. Można nadawać też wartości ujemne.
Tak pozycjonowany element staje się kontenerem dla wszystkich innych, które są absolutnie w nim pozycjonowane.

Pozycjonowanie absolut
Elementy z position:absolute. Możemy przesunąć element w dowolnym kierunku od miejsca położenia w kontenerze. Kontenerem są elementy z position relative, absolute, fixed. Gdy niema takiego elementu nadrzędnego to wybiera go przeglądarka. Może to być body ale nie musi.
Możliwości przesunięcia to top, bottom, left, right. Elementy pozycjonowane w ten sposób nie zajmują miejsca w dokumencie. Możemy więc przenieść element poza widzialny obszar w przeglądarce.

źródło - http://blog.atena.pl/position-relative-i-absolute