我的圖中額外的空間

Question

我在這裏遇到了問題，我創建了一個10/1的數字，它應該與我的img完全相同的空間（真正的尺寸是4000 */400 *因此10/1比例也是如此），但我有一個額外的空間，無處不在。

你知道它來自哪裏嗎？

這裏是我的代碼：http://jsfiddle.net/2drYk/21/

<figure class="container">     
    <img class="content" src="http://img7.imageshack.us/img7/6766/sampes.jpg" alt="sample" /> 
</figure> 

* 
{ 
margin:0; 
padding:0; 
border:0 
} 

.container 
{ 
    width:100%; 
    background:black; 
    overflow:hidden;  
} 
.content 
{ 
    width:100% 
} 


var $cont = $('.container .content'), 
    init_size = $cont.width()*0.1, 
    c =0, 
    s = [400,init_size]; 

$cont.height(init_size); 

$cont.click(function(){ 
    $(this).stop().animate({height: s[c++%2] }); 
}); 

編輯：看來，從事實來這個問題，我稱之爲2級在我的jQuery，但我仍然不知道爲什麼，這個比例仍然是相同的。

Answer 1

默認情況下圖像以內聯方式顯示，並且每行高度的字符下降空間都留有空間。

http://jsfiddle.net/2drYk/22/

.content { 
    display: block; 
}