CSS Вертикальное выравнивание текста в заголовке

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

Preview

Заголовок имеет заданную высоту 141 пикселей, и все в этом заголовке должно быть прямо посередине. Даже «Имя веб-сайта здесь» , поэтому, если это имя изменится и займет только 1 строку или, может быть, 3 строки, все будет в одном месте.

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


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

HTML:

<div id="header">
    <h1>Name of Website Here</h1>
    <h3>Call Today!<br /><span>(xxx) xxx-xxxx</span></h3>
    <p>123 Main St.<br />City, State, Zip</p>
</div>

CSS:

#header{height:141px;}
#header h1{float:left;font-size:1.7em;width:200px;text-align:center;line-height:26px}
#header h3{float:left;text-align:center;color:#e62520;font-size:1.7em;line-height:26px;font-style:italic;margin:0 0 0 95px}
#header h3 span{font-size:1.2em;}
#header p{float:right;color:#2a5091;font-size:1.3em;font-style:italic;font-weight:bold;line-height:20px;text-align:right;}

Спасибо!

7
задан tw16 16 August 2011 в 20:58
поделиться