Почему маржа находится в верхней части моей страницы?

mypage.htmlПочему маржа находится в верхней части моей страницы?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html> 
<head> 
<title>Color Flash Cards</title> 
<link rel="stylesheet" href="css/index.css" /> 
</head> 
<body> 
<div id="header"> 
    <div id="title"> 
     <h1>Color Flash Cards</h1> 
    </div> 
</div> 
</body> 
</html>

index.css

body{ 
    background-color: #31859C; 
    margin-left: 0px; 
    margin-top: 0px; 
    overflow-x: hidden; 
} 
#header{ 
    margin-top: 0px; 
    height: 120px; 
    background: #9838CE; 
} 
#title{ 
    margin-top: 0px; 
}

результат:

Ghost Margin

Где маржа, которая находится в го e top (выше фиолетового), исходящий из? И что мне нужно сделать, чтобы избавиться от него? Я могу использовать отрицательные значения для margin-top, чтобы сделать это, но является ли это «реальным» решением здесь?

источник

2013-05-11 FoamyGuy

Возможно, заполнение по умолчанию в браузере? Попробуйте 'padding: 0' on' body'. – tobiv

Боковое примечание. Ваш doctype предназначен для страниц, которые используются как application/xml + xhtml, и я сомневаюсь, что вы это делаете. – Rob

Все заголовки имеют запас по умолчанию, которое можно отменить с помощью:

h1 { 
    margin: 0; 
}

Демо:

Я бы рекомендовал использовать код сброса CSS, как т his one, если вы хотите, чтобы избежать этих причуд и нарисуйте их сами.

источник

2013-05-11 15:47:17 Ian

Одна из двух вещей может быть причина этого:

накладки в организме? Добавить padding: 0; на тело.
Верхний край на H1. Для борьбы с этим добавить overflow-hidden; к #header

Добавление overflow: hidden к #header заставит заголовок DIV содержать его содержимое (включая края на H1).

источник

2013-05-11 15:46:34

Установите margin из h1 тега 0:

h1 { margin: 0; }

См jsFiddle demo.

источник

2013-05-11 15:48:34

Попробуйте установить поля html на .

html { 
margin:0; 
padding:0; 
}

источник

2013-05-11 15:51:02 ckpepper02

две вещи: Вы можете добавить

body{ 
    padding:0; 
}

, но это не реальная проблема, сво H1 тег, который портит расположение

добавить это к вашему CSS

h1{ 
margin-top:0; 
}

вот немного fiddle

источник

2013-05-11 15:51:48 lazyprogrammer

использовать сброс css для настройки браузера по умолчанию будет сброшен.

http://meyerweb.com/eric/tools/css/reset/ 
enter code here

источник

2013-05-11 15:55:59 dsfg

Почему маржа находится в верхней части моей страницы?

ответ

Смежные вопросы