Html 在图像下方放置div时获得某种边界？

所以我有一个100%宽度的图像，我有一个div，我想直接放在图像下面。 在图像和div之间似乎有某种边界或线条，我似乎无法摆脱，我知道这是从背景上看的，我不想使用固定位置，因为在不同分辨率下，它不会直接位于它的下方。 我尝试过将正文填充和边距重置为0，但似乎没有帮助

HTML:

下面是一个JSFIDLE：

---

由于大小原因，该JSFIDLE中的图像没有100%宽度，但我的应用程序中的图像有100%宽度。

图像具有样式

显示：内联块或
显示：内联。所以它被视为文本，浏览器显示这一额外的行以分隔文本行

尝试给出图像：
style=“display:block；”
。
还记得将页边距设置为0:
style=“margin:0px；”

这是您修改过的小提琴：

    <header>

        <img class="forumheader" src="http://profile.ak.fbcdn.net/hprofile-ak-snc4/50356_434008550256_1008261_n.jpg"/>

    </header>

    <div class="content">
        I am a content.
    </div>

.content{
height:400px;
width:100%;
background: #202020;
}

body{
background:#ff00ff;
margin:0;
padding:0;
}