Белая полоса над блоком: кошмар перфекциониста

@Димасий · Регистрация: 12.03.2014

Студворк — интернет-сервис помощи студентам

И вновь старая, как мир, проблема с возникновением белой полосы. Она вылезает в Header-е при использовании заголовка с тегом <h1>. При этом, если писать обычный текст, полосы не возникает. Такое ощущение, что заголовок не помещается на строке и блок добавляет новую строку (почему-то белую).
Скорее всего, причина кроется в какой-то мелочи, но я уже не могу сообразить.

Буду безмерно благодарен за помощь.
Код:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<html>
<head>
<meta http-equiv="index.html" content="text/html; charset=utf-8" />
<title>Finoff.ru</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
 
<body>
 
<div id="container">
 
<div id="header">
<h2 align="center"><font color="white">Header1<br>Header2</font></h2>
 
</div>
 
<div id="navigation">
 
</div>
 
<div id="menu">
 
<p align = "center"><font color = "white">
1<br>
2<br>
3<br>
4<br>
</font></p>
 
</div>
 
<div id="content">
 
</div>
 
<div id="clear">
 
</div>
 
<div id="footer">Подвал сайта
 
</div>
 
</div>
 
</body>
</html>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
body {
            color: #000000;
        margin:0;
        padding:0;
}
 
#container {
        border: 7px groove #e3e3e3;
            background: #FFFFFF;
            margin: 30px auto;
            width: 900px;
            height: auto;
}
 
#header {
            background: #228B22;
            height: 70px;
            width: 900px;
}
 
#navigation {
            background: #32CD32;
            width: 900px;
            height: 20px;
}
 
#menu {
            background: #228B22;
            float: left;
            width: 200px;
            height: 600px;
}
 
#content {
            background: white;
            float: right;
 
            width: 700px;
            height: 600px;
}
 
#clear {
            clear:both;
}
 
#footer {
            background: #838283;
            height: 50px;
            width: 900px;
}

@Lazy_Den · 13.10.2014, 00:10

Добавьте в самое начало CSS:

CSS
1
2
3
4
* {
    margin: 0;
    padding: 0;
}

Хотя, не плохо было бы использовать более глубокий сброс стилей.

Добавлено через 1 минуту

Не по теме:

Хотел поинтересоваться, а вы действительно используете тег <font>, атрибут align и color?

@Димасий · 13.10.2014, 01:04 **[ТС]**

Благодарю вас! Видимо, к вечеру голова совсем перестала соображать.

Добавлено через 24 минуты
Ответ на вопрос не по теме: это была теория, мне было интересно выяснить, в чем проблема)

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

@Димасий 0 / 0 / 0 Регистрация: 12.03.2014 Сообщений: 31
	13.10.2014, 01:04 [ТС]
	Благодарю вас! Видимо, к вечеру голова совсем перестала соображать. Добавлено через 24 минуты Ответ на вопрос не по теме: это была теория, мне было интересно выяснить, в чем проблема) 0