Как убрать пробел между заголовком и контейнером div в HTML5 Boilerplate

Question

Я стремлюсь использовать шаблон HTML5 от Paul Irish, но я столкнулся с проблемой css.

Я хочу, чтобы заголовок был сброшен вверху страницы, но я не могу добавить контейнер divпробел, от которого я не могу избавиться.

Я думаю, это как-то связано с очисткой нижнего колонтитула.Я пробовал экспериментировать с различными размерами отступов для нижнего колонтитула и контейнера, но безрезультатно.

Это HTML-код:

<header>
  <p> header content </p>
</header>

<div id="main" role="main">

</div>
<footer>
  <p> footer content </p>
</footer>

Мой пользовательский CSS:

#container {
    background-color:orange;
    padding:1px; /* can't be zero */
    margin:0; 
}

footer {
    margin: 1px 0;
}

body {
    width:960px;
    margin:0 auto;
    background:blue;
    padding:0;
}

Answer 1

@ techjacker; может быть, вы должны написать так:

 header{display:block}
    p{margin:0;padding:0}

Answer 2

Это иногда помогает:

• Установить поля и отступы до 0.
• И убедитесь, что для кодировки установлено значение: UTF-8 без спецификации.