width, height, clip

CSS-P에서 NN4는 width, height 만 으로는 지정한 크기의 block이 나오지 않습니다. 내용물이 있는 만큼만 나옵니다. width와 clip으로 크기를 지정하면 clip에서 지정한 크기가 정확히 나옵니다. 그러므로, width와 clip를 해주어야 지정한 크기가 나옵니다. IE4는 width와 height 두 개만으로 지정한 크기의 css-p가 나옵니다. 하지만, clip 크기를 바꿀 때는 width, height, clip을 지정해 주어야 지정한 크기의 block이 나옵니다.

그러므로, block을 clip할 때는 width:100; height:100; clip:rect(0,100,100,0); 이렇게 3가지 모두 지정해야 정확한 크기의 사각형이 나오고 clip 수정을 할 수 있습니다. .

clip:rect(top, right, bottom, left)입니다. block element의 보이는 부분을 지정합니다.

레이어의 크기는 border도 포함합니다. block element에 border-size:10; 으로 style을 지정하고 크기가 100px인 이미지를 넣고 block element의 크기를 읽으면 nn4의 document.width는 126px이고 , ie4의 offsetWidth는 120px입니다. 즉, nn4는 border와 내용물의 틈사이에 3px의 간격이 생깁니다.

border-size가 1이고 clip을 400, 400으로 할려면 ie4의 경우는 border-size의 크기를 밴 398, nn4는 border-size의 값과 border와 내용물의 틈을 함쳐서 392로 하면 가장 꽉찬 내용물을 border안에 넣을 수 있습니다.

<span style="width:30; border-style:solid; border-color:aqua; border-width:10;"><img src="../../images/100x100.jpg"></span>

그리고, 내용물과 block element의 닫는 것(</div>, </span) 사이에 공백이나 개행을 한 html 구문은 border-bottom과 내용물 사이에 두 브라우저 모두 4px의 간격이 생깁니다.

<span style="width:30; border-style:solid; border-color:aqua; border-width:10;">
	<img src="../../images/100x100.jpg">
</span>

그러므로 block element를 사용할 때는 nn4의 3px간격이 생기는 것과 닫는 html 구문에 공백이나 개행을 하지 않아야 겠습니다. span, div 둘 다 마찬가지 입니다. 모니터 해상도와는 상관이 없었습니다. 3px, 4px입니다.

ie4에서 border가 있는 block element에서 width의 값은 border-left와 border-right의 크기를 더한 값보다 큰 값을 지정해야 글자나 이미지같은 내용물이 나옵니다. 같거나 작으면 내용물이 나오지 않았습니다. (ie4.71)

TOP Go to UP TOP