배경 이미지 A, 액자틀 이미지 B, 끼워넣을 그림 C D E가 있을 때
아래의 예제처럼 표시되게 하고 싶습니다.

지금 작성한 소스에서 미리보기를 하면 아래와 같이 나오지만




실제 적용 시 자꾸만 아래와 같이 나옵니다.




<div id="img1" style="display:block; position:absolute; z-index:3"><img src="https://upload2.inven.co.kr/upload/2016/06/15/bbs/i13089306365.png"></div>
<div id="img2" style="display:block; position:absolute; z-index:2"><img src="~~~이미지 주소(50*50픽셀)~~~"></div>
<div id="img3" style="display:block; position:relative; z-index:1"><img src="https://upload2.inven.co.kr/upload/2016/06/15/bbs/i13038680339.png"></div>

3번이 B 1번이 A, 2번에 C D E 주소 넣으면 각각 끼워져서 위 그림처럼 나오는건 줄 알았는데..
자꾸 아래처럼 다 따로 나오네요ㅠㅠㅠ 이렇게 작성하면 되는 게 아닌가요?
왜 자꾸 저렇게 다 뿔뿔히 흩어지는걸까요? ㅠㅠ