Вопрос вертикального выравнивания в CSS часто вызывает проблемы. Особенно они актуальны при необходимости выровнять блок внутри абсолютно-позиционированного блока. Но есть простое решение, о котором сейчас и пойдет речь.
Итак, решение достатоно простое, но не очевидное. Итак.
CSS:
.valign { position: relative; top: 50%; transform: translateY(-50%); /* vendor prefixes omitted due to brevity */ }
HTML:
test
Решение было найдено здесь.
Это решение круто помогло на одной из верстаемых страниц — поэтому в его работоспособности можете не сомневаться. Удачи!