Как сделать центрирование текста по центру по вертикали?

Question

[Кристина]

Как сделать центрирование текста по центру по вертикали?
При изменении окна браузера меняется размер изображения,
нужно чтобы надпись всегда была четко по центру.
При наведении на блок ниже появляется еще одна строка,
нужно, чтобы из-за нее верхняя строка не отодвигалась наверх.
project-promo.ru

Спасибо!

Answer 1

[Владимир Проскурин]

Я считаю вредным то, что сейчас тут все Вам покидают готовые ответы, т.к. лучше разобраться самой. Полезным будет покидать вам хорошие ссылочки, например вот https://css-tricks.com/centering-css-complete-guide/

UPD: Полоску можно сделать с position: relative, тогда она не будет влиять на высоту текста, а значит и на его выравнивание. Только смотрите, при маленькой высоте блока, эта полоска может выйти за пределы.
UPD: поправочка, не relative, а absolute

Comments

[Кристина]

Спасибо!

Answer 2

[akavato]

На хабре
Вот тут все способы, на русском

Answer 3

[Юрий Кизилов]

.page {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}