- position : static -- 기본 값,
- position : relative -- 기본으로 위치해야 할 곳에서 top, bottom, left, right 등의 box offset property를 이용하여 위치를 변경 시킬 수 있음
- position : absolute -- position이 absoulte인 element는 기본 document flow에서 제외된다. 그렇기 때문에 relative 또는 absoulte한 부모의
위치를 기준으로 element의 위치가 정해지게 된다.
element의 position : absolute 이고, 해당 element의 가장 가까운 상위 엘리먼트의 position: relative(or absolute) 일때
1. 위치
parent element가
postion : relative,
child element가position : absolute,top:20px이라면 부모의 위치를 기준으로 top에서 20px 만큼 내려오게 됨
2. 크기
<div class="parent">
<div class="child"> 1</div>
<div class="child"> 2</div>
<div class="child"> 3</div>
</div>.parent { position : relative} .child { position : absolute, height : 10px }이렇게 child에 height를 넣어줬는데 parent의 div height이 변동이 없었다. position : absolute 인 element는 document flow에서 완전히 제외되기 때문이다. 부모에게 영향을 주지 못하기 때문에 부모의 height는 child의 높이에 따라 자동으로 늘어나지 않는다.
