Page 1 of 1

img 아래 약간의 여백

Posted: 2006 03 02 18:07 54
by muik
XHTML 1.1 문서입니다.

이 문서에 <img /> 태그로 넣은 모든 이미지 아래 부분에 약간의 공백(약 3픽셀정도)이 생깁니다. 어떤 방법으로 이 아래 공백을 없앨수 있을까요?

이미지태그를 div로 감싸보기도 하고 border,margin을 0으로 해보기도 했는데 안되는군요..

익스에서 보면 이미지의 아래 공백이 없습니다. 불여우에서만 아래 공백이 생깁니다.

Posted: 2006 03 02 21:57 12
by hyeonseok
이미지의 크기가 어느정도 인가요?

Posted: 2006 03 02 23:35 51
by zotoon
예제 페이지를 보여주면, 좀 더 확실한 답을 드릴 수 있겠으나,

style을 지정할때, 선택자 + img {display:block;}으로 해결할 수 있습니다.

선택자은 div나 p또는 a가 될 수 있습니다.

답변 감사합니다.

Posted: 2006 03 03 07:20 57
by muik
zotoon wrote:예제 페이지를 보여주면, 좀 더 확실한 답을 드릴 수 있겠으나,

style을 지정할때, 선택자 + img {display:block;}으로 해결할 수 있습니다.

선택자은 div나 p또는 a가 될 수 있습니다.
img { display:block; } 이처럼 하니까 잘 해결되었습니다. 답변 감사합니다.

그런데 이런 현상이 왜 나타나는지 모르겠습니다. 이것은 표준화 되어서 그런건가요?

Posted: 2006 03 03 08:40 08
by eouia
img는 기본적으로 inline element입니다. 따라서 block처럼 region으로 인식되는 게 아니라 행의 일부문자처럼 인식됩니다. "행"의 높이와 문자높이와의 관계는 기본적인 typography 책들만 보셔도 잘 설명되어있습니다.