#D1 { 
	position:absolute; left:0; top:0; 
	width:100; height:100;
	border-width:2;
	padding:5;
	margin:10;

	border-color:red; border-style:solid; 
	background-color:yellow; 
	layer-background-color:yellow;
}
<span id=D1><img src="100x100.jpg" width="100" height="100"></span>


레이어를 상위의 element에서 떨어지게 하는 maring:10; 을 넣었습니다.

nn4 레이어.document.width, 레이어.document.height 는 10을 더해 줍니다. margin 만을 지정했을 때 이렇습니다. padding 같이 양쪽에서 지정되는것이 아니고 오직 한쪽의 값 10 만을 더해줍니다. 그래서 130 으로 됩니다. margin-left, margin-top은 되는데 margin-right, margin-bottom은 지정이 안됩니다. margin을 지정하면 사면에서 margin을 지정하는 해야하는데 두면만 적용되는 버그입니다.

ie4의 레이어.offset, 레이어.client 는 margin 값을 더하지 않습니다. 단순히 상위에서의 위치만 10px 떨어지게 하지 레이어의 크기는 더하지 않습니다.

nn4, ie4 모두 좌표값은 0, 0 입니다. margin을 준다고 좌표값이 달라지는 것은 아닙니다. 차이점은 margin을 지정한 레이어를 보면 nn4은 border 봐ㄲ에 바탕색이 margin 값만큼 있지만, ie4에서 margin 값만큼 바탕색이 나오지 않는다는 겁니다.

BACK