html - 子画像の高さに基づく DIV の高さは、下部にいくつかの余分なピクセルを追加します

Question

画像の親 div の下部に余分なピクセルがいくつかあるのはなぜですか。親 div の高さをハードコードせずにピクセルを削除するにはどうすればよいですか。

http://jsfiddle.net/6x8Dm/

HTML

<div class="wrapper">
    <div class="column">
        <img src="http://www.lorempixel.com/200/200/" />
    </div>    
</div>  

CSS

.wrapper {
    width:200px;
    margin:0 auto;
}
.column {
    width:100%;
    background:#cc0000;
}

img {
    width:100%;
}