img 아래 약간의 여백

국내에 웹 사이트들이 웹 표준을 지키고 OS나 브라우저와 관계 없이 접근성을 향상 시키기 위한 사이트 버그 신고 및 문제 해결을 위한 게시판입니다.
Post Reply
muik
Posts: 2
Joined: 2005 12 30 09:14 04
Contact:

img 아래 약간의 여백

Post by muik »

XHTML 1.1 문서입니다.

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

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

익스에서 보면 이미지의 아래 공백이 없습니다. 불여우에서만 아래 공백이 생깁니다.
hyeonseok
해커
해커
Posts: 691
Joined: 2004 08 11 22:14 59
Contact:

Post by hyeonseok »

이미지의 크기가 어느정도 인가요?
zotoon
Posts: 24
Joined: 2005 03 12 10:28 29
Location: 광주
Contact:

Post by zotoon »

예제 페이지를 보여주면, 좀 더 확실한 답을 드릴 수 있겠으나,

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

선택자은 div나 p또는 a가 될 수 있습니다.
muik
Posts: 2
Joined: 2005 12 30 09:14 04
Contact:

답변 감사합니다.

Post by muik »

zotoon wrote:예제 페이지를 보여주면, 좀 더 확실한 답을 드릴 수 있겠으나,

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

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

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

Post by eouia »

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

Who is online

Users browsing this forum: No registered users and 1 guest