インラインブロックイメージの下のスペースを取り除く

Question

イメージをインラインブロックとして保持しながら、イメージの下端とラッパーの間のスペースを取り除くにはどうすればよいですか？なぜこうなった？

http://jsfiddle.net/dJVxb/2/

HTML：

<div id="wrapper"> 
<img src="https://twimg0-a.akamaihd.net/profile_images/1735360254/icon_reasonably_small.jpg" >     
</div> 

CSS：

​#wrapper { 
    background:green; 
} 
img { 
    display:inline-block; 
    margin:0; 
} 

Answer 1

書込みvertical-align:top;。このように書く：スペースを追加

img { 
    display:inline-block; 
    margin:0; 
    vertical-align:top; 
} 

チェックこのhttp://jsfiddle.net/dJVxb/4/

Answer 2

はディセンダーのための部屋を作るためにそこにあるインラインテキストにもありました。降下者は、「y」や「g」のように、下に届く文字の部分です。あなたがcenterまたはbaselineのvertical-align特性を保持する必要がある場合は

、あなたline-height0にを設定することにより、この問題を解決することができます。