css - 我不知道为什么我的 webheader div 和我的 header div 之间有一个空格？

Question

这是相关的html代码：

<div id="something"><img src="Images/guysonlycopy.jpg" alt="image" width="1200"     height="300" /></div>  
   <header>
<div id="title"><img     src="http://blog.flamingtext.com/blog/2013/08/29/flamingtext_com_1377801873_445376518.jpg" padding="15px" /></div>

我的第一个 div 是“某物”，第二个是“标题”，但它们之间有大约 5px 的间隙，这是我不想要的。

body {
font: normal .8em/1.5em Arial, Helvetica, sans-serif;
background: #ebebeb;
    width: 1200px;
margin: 100px auto;
color: #666;
}

#wrapper {
background-color: #ccc;
margin: 0;
width: 1200px;
}

/* Header
--------------------------------------------*/

header {
background-color: #170a6e;
height: 100px;
width: 1200px;
margin: 0;
padding: 0;
}

header h1 {
font-size: 4.5em;
float: left;
margin: 20px;
padding: 5px;

}

#something {
text-align: center;
padding: 0;
margin: 0;
}

#title {
float: left;
margin-left: 25px;
margin-top: 11px;
}

那就是CSS。我希望图像和第二个 div 之间没有间隙。

Answer 1

默认情况下，图像是inline元素，这意味着它们会留下下行空间。要摆脱这一点并将它们用作block关卡元素，display: block;请在图像本身上设置。