Выравнивание по высоте будет отличаться от того, в потоке располагается контейнер текста или вне потока.
Любимым решением для потока до появления flex был table-cell.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Вертикальное выравнивание display: table-cell</title>
<style>
.wrapper {
display: table;
width: 100%;
}
.cell {
display: table-cell;
height: 100px;
vertical-align: middle;
}
</style>
</head>
<body>
<div class="wrapper">
<p class="cell">Я выровнен по вертикали</p>
</div>
</body>
</html>
Код взят с сайта
verstaka.net/verstka/gorizontalnoe-i-vertikalnoe-v...