Как сделать кнопки одинаковой высоты?

Question

[SpaceWayfarer]

Кнопки (ссылки) располагаются в ряд. Текст в них может быть расположен как в одну строку, так и в две, возможно и больше. Нужно сделать так, чтобы высота у этих кнопок была одинаковая, а текст располагался по высоте по центру.
Собственно, вопрос в том, как сделать, чтобы текст был по центру? То есть, если установить заданную высоту, то однострочный текст будет прижат к верху, а если задать какой-нибудь там line-height, то уже двухстрочный будет вываливаться.

Answer 1

[lnked]

<a class="b"><span class="b__i">Lorem ipsum</span></a>
<a class="b"><span class="b__i">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span></a>
<a class="b"><span class="b__i">Lorem ipsum dolor sit amet</span></a>

.b {
    max-width: 200px;
    height: 50px;
    padding: 0 20px;
    font-size: 0;
    line-height: 50px;
    text-decoration: none;
    display: inline-block;
    vertical-align: top;
}

.b__i {
    font-size: 13px;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}

Comments

[Павел Кононенко]

Зачем так много кода? Ведь по умолчанию тег button и так выравнивает по высоте?

[lnked]

Павел Кононенко: баттон я поставил для примера, можно использовать тег а и тогда все поплывет, поэтому и так много кода

[lnked]

Поправил пример кода что бы было понятнее

Answer 2

[Павел Кононенко]

Не гуд конечно, но обычно это делается так:

.btn {
  display: table-cell;
  vertical-align: middle
}

Answer 3

[xmoonlight]

так

Answer 4

[SpaceWayfarer]

всем спасибо. :3