Пробел/пробел между заголовками 1 и 2

Я пытаюсь поместить h2 прямо под h1, но, похоже, создается огромный пробел/пробел. Есть ли определенный способ избежать этого или это ошибка в кодировании? Спасибо.Пробел/пробел между заголовками 1 и 2

Ссылка на сайт: http://younani.com/armen/musicindex.html

HTML:

<!DOCTYPE html> 
<html lang="en"> 
<head> 

    <title>Armens website</title> 
    <meta charset="utf-8"> 
</head> 
<body> 
<div class="clearfix" id="container"> 
<p><link rel="stylesheet" href="armen.css" /></p> 
<h1><i>Four To The Floor</i></h1> 
<h2>Artist Management &amp; Events</h2> 
<p></p> 
<h3>&ldquo;It&rsquo;s not where you take things from,<br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; it&rsquo;s where you take them to.&rdquo; <br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; - Jean-Luc Godard</h3> 
<div id="footer"> 
<p>Armen Sarkisian &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<a href="mailto:[email protected]">[email protected]</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<a href="http://www.fttfmusic.com/">www.fttfmusic.com</a></p> 
</div> 
</div> 
</body> 
</html>

CSS:

h1 {color: #FFFFFF; font-family: ballparkweiner; font-size: 70px; 
text-align: center; } 

@font-face { 
    font-family: 'ballparkweiner'; 
    src: url('ballw___.eot'); 
    src: url('ballw___.eot?#iefix') format('embedded-opentype'), 
     url('ballw___.woff') format('woff'), 
     url('ballw___.ttf') format('truetype'), 
     url('ballw___.svg#ballparkweiner') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 

h2 {text-align: center; font-size: 40px; color: #FFFFFF; font-family: Cambria;} 

body {background-color: #000000;} 

h3 {text-align: center; color: #FFFFFF; } 

#footer { font-weight: bold; text-align: center; font-family: Audimat; 
    clear: both; width:48%; 
     border-radius: 8px; 
     background-color:black; 
     text-align:center; margin-right:auto; 
     margin-left:auto; color: #FFFFFF; }

источник

2013-04-09 KKP

h* элементы в браузерах, как правило, имеют некоторые .. довольно большой верх по умолчанию и нижнего полей. Вы можете просто установить их конкретно какое-то меньшее значение, даже ноль:

h1, h2 { 
    margin-top: 0; 
    margin-bottom: 0; 
}

Вы, конечно, можете применить эти правила к конкретным заголовкам.

источник

2013-04-09 04:32:11

Это margin на h1 и h2. Откорректируйте их в своем CSS, например.

h1, h2 {margin: 0;}

источник

2013-04-09 04:32:16

Добавьте это в CSS:

h1, h2 { 
    margin: 0px; 
}

источник

2013-04-09 04:32:26 Arbel

Код: - Вы можете попробовать это

<div id="container" class="clearfix"> 
<p><link href="armen.css" rel="stylesheet"></p> 
<h1 style="margin-bottom: -18px; margin-top: 0px;"><i>Four To The Floor</i></h1> 
<h2 style="margin-top: 0px; margin-bottom: 0px;">Artist Management &amp; Events</h2> 
<p></p> 
<h3>“It’s not where you take things from,<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; it’s where you take them to.” <br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; - Jean-Luc Godard</h3> 
<div id="footer"> 
<p>Armen Sarkisian &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<a href="mailto:[email protected]">[email protected]</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<a href="http://www.fttfmusic.com/">www.fttfmusic.com</a></p> 
</div> 
</div>

СМОТРИТЕ ЭТУ ССЫЛКУ http://css-tricks.com/forums/discussion/3825/solved-h1-and-h2-tags-leaving-too-much-space/p1

источник

2013-04-09 04:35:35 Darshan

Пробел/пробел между заголовками 1 и 2

ответ

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