Как сделать так, чтобы мой заголовок располагался вверху браузера?

Question

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

   /* CSS Document */

html, body, {
    margin: 0;
    padding: 0;
}

body {
       font: 12px/16px Verdana, Geneva, sans-serif;
       color: #000;
       background-color:#426fac;

}

/*** header
****************************************/
#header {
    background: url(images/header-bg.png) no-repeat center top;
    overflow: hidden;
}

Есть идеи, как это сделать?

Answer 1

Это потому, что у вас есть ошибка в вашем CSS

вам нужно удалить последнюю запятую (,) из html,body, { и сделать ее html,body {

В настоящее время первое правило CSS о html и теле не выполняется из-за этого ..

Answer 2

Возможно, вы захотите определить, какой элемент вашего заголовка (h1 / div /?) Также имеет 0 полей - у многих элементов есть встроенные поля, и это может вызывать пространство, которое вы видите, так как #header is очевидно привязанный к чему-то

Answer 3

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

Или вы можете использовать firebug . Просто выберите элемент #header и просмотрите определения CSS, которые к нему применяет браузер. Это может быть #header или родитель / предок заголовка.

Answer 4

Попробуйте добавить #header в список html, body, что получит margin: 0; padding: 0.