div 이미지 공백 없애기
div나 table 안에 이미지를 넣다 보면 뜻하지 않게 공백이 생기는 경우가 있습니다. 이미지 공백은 왜 생기는 것일까? 이미지는 인라인 요소인데요, 인라인 요소를 사용하면 보이지 않는 라인 박스(행 박스)를 생성합니다. 이 박스 안의 내용을 수직 정렬할 때 두 가지 방식이 존재합니다. 인라인 요소의 수직 정렬 1. 비표준 모드(IE7이하, doctype 선언하지 않은 문서): 박스의 border bottom에 맞추어 정렬 2. 표준 모드(doctype 선언한 문서): baseline에 맞추어 정렬 [방법 1] 인라인 요소(이미지)를 블록 요소로 만들기 인라인 요소로 인해 생성된 박스의 수직 정렬이 문제이므로, 인라인 요소를 블록 요소로 만듭니다. [방법 2] 인라인 요소의 기준선을 bottom에 맞추..
