strict mode에서의 mysterious gap
Written on 2005.05.14, 3:53 pm by jay
xhtml transitional에서 strict로 변환후 미처 발견하지 못했던 문제점이 이제서야 보인다. image나 object의 아래쪽에 정체불명의 빈공간이 생겨버렸다. css를 수정하는 과정에서 생겨난 내 실수려니 했었지만 quirks mode나 transitional mode에서의 테스트에선 문제가 없는걸로 보아 strict의 자체적인 버그내지 특성으로 생각된다.
p {
background: #f39;
margin: 0;
padding: 0;
}
<p><img src="test.png" alt="test" /></p>
이 소스를 테스트해보면 strict mode에선 아래와 같이 이미지의 아래에 필요치않은 빈공간이 나타나게 된다. – 사진에서의 아래 핑크색 부분.

이걸 해결해주려면 이와같이 별도의 style을 지정해주어야한다.
p img {
display: block;
}

display: block으로 해결이 된다고 하지만 엄청나게 번거로운건 사실이다. 그래서 다시 transitional로 돌아가련다.
- updated @ 2005.8.7
- strict모드에선 img 태그가 기본으로 inline속성을 띈다고 한다. inline의 경우 j 나 g 처럼 튀어나온 글자때문에 아래쪽에 약간의 여백이 기본으로 들어간다는 ilmol님의 설명.