position : absolute 와 position : relative 의 차이점
개발/CSS(SCSS)2023. 3. 13. 21:01position : absolute 와 position : relative 의 차이점

position : absolute 와 position : relative 의 차이점을 이해하는 데 적지 않은 시간을 보낸 적이 있었다. 누군가에게는 도움이 되기를 바라며 그림으로 차이점을 설명해보겠다. 먼저 position 속성을 지정하지 않을 때, position의 기본 동작을 알아야 한다. position: static position을 따로 선언해두지 않으면 기본값으로 적용된다. 기본적으로 흐름의 현재 위치를 기준으로 요소를 배치한다. top, right, bottom, left, z-index는 적용되지 않는다. position: relative 레이아웃을 변경하지 않고 현재 자신의 위치를 기준으로 요소를 배치한다. position: absolute 가장 가까운 위치에 있는 부모 요소 위치를 기..

image