position : absolute & relative / sticky & fixed

absolute & relative

absolute를 사용하면 기존의 자리에서 빠져나온다.

따라서  다른 요소가 있다면, 빠져나온 자리를 차지한다.

 

빠져나온 요소는 부모요소의 소속이 된다.

부모요소는 position 속성이 static에 아닌 가장 가까운 요소를 기준으로 삼는다. 

 

sticky & fixed

sticky 기존 자리에 있다가 요소가 브라우저에서 안 보일 때, 정한 속성값대로 고정된다.

 

fixed 원래 문서에서 빠져나와 고정된상태로 존재한다.

 

공부자료

https://developer.mozilla.org/en-US/docs/Web/CSS/position