은 DIV의 IMG는 크롬

Question

에서 맨 아래에 여분의 공간을 만들어 I가 다음 코드

HTML :

<div class="dropShadow"> 
    <img src="images/headerimage" /> 
</div> 

CSS :

div.dropShadow { 
    background-image: url('dropshadow.png'); 
    background-position: bottom center; 
    background-repeat: no-repeat; 
    padding-bottom: 19px; /* the height of the shadow */ 
} 

그러나, 잘 파이어 폭스의 모든에, Chrome 및 IE의 경우 이미지 아래쪽과 위치가 지정된 배경 이미지의 상단 사이에 작은 공백이 있습니다. 나는 주위에있는 모든 공백을 제거했지만 어떤 규칙을 시도해야할지 모르겠습니다. 어떤 제안?

Answer 1

세로 정렬 : 상단 또는 디스플레이 : 블록를 IMG에 기록하십시오. 다음과 같이 쓰십시오 :

img{ 
vertical-align:top; 
}