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

Question

У меня есть заголовок

<h1>My Header</h1>

Он имеет высоту 150px и font-size , скажем, 1.3em; Как я могу сделать текст заголовка по центру с помощью CSS. Я бы предпочел не оборачивать его в контейнер DIV (обертывание div на самом деле побеждает всю идею CSS).

Answer 1

Лучше всего добавить это правило:

h1 {
    line-height: 150px;
}

Вам не нужно устанавливать значение высоты, а размер шрифта не влияет на выравнивание по вертикали.

Answer 2

Если высота заголовка составляет 150 пикселей, не могли бы вы также установить для line-height значение 150 пикселей?

h1
{
    font-size: 1.3em;
    line-height: 150px;
    height: 150px;
}