Блог

Итак, у меня есть изображение шириной 100%, и у меня есть div, который я хочу расположить непосредственно под этим изображением. Кажется, между изображением и div есть какая-то граница, от которой я не могу избавиться, и я знаю, что из-за фона я не в настроении использовать фиксированное положение, потому что тогда оно не было бы прямо под ним в различных разрешениях. Я пытался сбросить отступы для основного текста и поля на 0, но, похоже, это не помогает.

HTML:

     <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>
  

CSS:

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

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

Вот jsfiddle:http://jsfiddle.net/AYnaN/
Изображение не имеет 100% ширины в этом jsfiddle из-за размера, но изображение в моем приложении имеет 100% ширину.

Изображение имеет стиль display:inline-block; или display:inline; по умолчанию в большинстве браузеров. Таким образом, это обрабатывается как текст, и браузер отображает эту дополнительную строку для разделения текстовых строк.

Попробуйте предоставить изображение: style="display:block;" . Также не забудьте установить поля равными 0: style="margin:0px;" .

Вот ваша измененная скрипка: http://jsfiddle.net/AYnaN/1 /.