div底部包含图像的空间 [英] Space at bottom of div containing image

问题描述

为此，为什么在 div#imageDiv 的底部有一个空格?

For this fiddle, why is there a space at the bottom of div#imageDiv?

JSFiddle

<div>
<div>
<div>
    <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SIPI_Jelly_Beans_4.1.07.tiff/lossy-page1-256px-SIPI_Jelly_Beans_4.1.07.tiff.jpg" />      
</div>
</div>
</div>
<div id="text"><div id="inner">text goes here</div></div>        

html {
  line-height: 1.5em;
}
#text {
  background-color: grey;
  margin-top:-7px;
}

推荐答案

将图片设置为 img {display:block;} .并且请下次在SO上在此处添加您的代码，以防止链接腐烂，让我们在此处轻松查看您的代码.

Set your image to img { display: block; }. And please next time add your code here on SO to prevent link rot and lets us easily review your code here.

这篇关于div底部包含图像的空间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！