position:absolute와 position:relative 활용

<div class="test1">

<div class="test2">2</div>

</div>

.test1{position:relative; width:200px; height:200px; margin-left:100px; margin-top:100px; }

.test2{position:absolute; width:50px; height:50px; left:0px; top:0px; }

일 경우

.test2 의 위치는 기준점이 모니터 좌측상단 (0, 0)가 아니라 test1 요소의 왼쪽 최상단이 기준점이 됨.

그러므로 실질적인 .test2의 위치는 .test1의 margin값 (100, 100)에 위치