CSS - Image 겹치기

이미지를 겹치기 위해서 Style 프로퍼티의 Position을 이해해야 한다. 
position의 default 값은 static이며 이는 해당 document에 그려지는 element 순서대로 위치하게 한다. 
relative는 기본 위치에서 해당 element를 이동시켜준고 td 정렬 기준으로 div 전반부를 사용한다. 
absolute는 가장 가까운 곳에 위치한 조상 엘리먼트에 상대적으로 위치가 조정된다. 

코드의 구조가 td > div > img 로 되있었으므로 다음과 같이 작성하면 해당 td에 들어가는 이미지에 한해서 겹쳐지게 된다.

<td>
  <div style="position: relative;">
    <img style="position: absolute;"/>
  </div>
</td>

absolute 로 지정하면 td 정렬 기준으로 div 왼쪽 영역부터 채워지니 이점 고려해서 left, top, padding 프로퍼티 값을 부여해서 컨트롤 하면 원하는 위치로 img 태그를 놓을 수 있다.