Выравнивание текста по вертикали при помощи CSS несколькими способами. Простые решения не всегда простой проблемы. Выровнять текст по центру по горизонтали легко — здесь работает практически во всех случаях старый добрый стиль text-align:center, который отлично работает и в табличных ячейках и в дивах:
<div style="text-align: center;">Текст, который нужно выровнять по горизонтали</div>С выравниванием по вертикали немного сложнее, но есть проверенные способы. Например, vertical-align подходит для ячеек таблиц и элементов в одной строке относительно друг друга. Можно добавить к vertical-align свойство display:table-cell и попробовать решить таким образом выравнивание и для других случаев:
<div style="height:200px; width: 400px; vertical-align:middle; display:table-cell;">
<p>Текст для выравнивания по вертикали</p>
<p>Текст для выравнивания по вертикали 2</p>
<p>Текст для выравнивания по вертикали 3</p>
</div>Мой любимый способ выравнивания текста по вертикали в CSS — свойство line-height. Здесь важный нюанс, чтобы этот вариант сработал — значение line-height должно быть равно значению height.
<div style="width:400px; height:200px; line-height:200px;">
<p>Текст бла бла бла</p>
<p>Текст бла бла бла</p>
<p>Текст бла бла бла</p>
</div>Это самые простые и востребованные способы решения, которые легко и просто запомнить.