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

Question

[alexnotonfire]

У меня есть следующий темплейт:

<ion-header-bar class="bar bar-header bar-dark">
</ion-header-bar>

  <ion-content>
    <div class="row no-padding">
      <div class="col dashboard-top-item center">QUOTATIONS</div>
      <div class="col dashboard-top-item center">INVOICES</div>
      <div class="col dashboard-top-item center">TIMER</div>
    </div>
    
    <button class="button button-full button-inv-blue companies center"> MY COMPANIES</button>

  </ion-content>
</ion-view>

И соответствующая CSS-ка

.dashboard-top-item {
  background-color: #4d4b4b;
  color: #A0A0A0;
  height: 130px;
  vertical-align: middle;
}

.button.button-full {
  &.companies {
    margin: 0;
  }
}

И все это выглядит вот так:


Как видите vertical-align не сработал.
Вопрос: как я могу выровнять текст по центру?

Answer 1

[Антон Федорян]

А если добавить line-height: 130px;

Comments

[alexnotonfire]

Помогло. Это решение не считается плохой практикой?

[Антон Федорян]

alexnotonfire: отнюдь, ничего плохого в этом нет

[Михаил Чирский]

Антон Федорян: не скажите, если у вас будет текст не в 1 строчку, будет дефект)

[alexnotonfire]

Михаил Чирский: может вы знаете более элегантное решение проблемы? Если все таки будет две строчки?

[Михаил Чирский]

alexnotonfire: Скажу честно с ionic не работал вовсе, в обычной верстке есть куча способов.
Вот парочка из них: https://jsfiddle.net/xojyhztL/