bootstrap vueの<b-table>コンポーネントで表示するセルの中身を、上下中央揃えにしたいです。

Question

前提・実現したいこと

bootstrap vueの<b-table>コンポーネントで表示するセルの中身を、上下中央揃えにしたいです。

該当のソースコード

<b-table
  :items="tableItems"
  :fields="fields"
  class="small"
  bordered
  outlined
  head-variant="light"
>
<template v-slot:cell(description)="data">
  <p class="text-left">{{ data.item.description }}</p>
</template>

...

上記の、data.item.descriptionを上下中央揃えにしたいです。
現在、テキストが左寄せ、要素が上寄せ？になっています。（手書きですみません。）
![]

試したこと

Chromeの開発者ツールで、.table th, .table td にvertical-align: middleをつけると、期待通りの表示になります。

よろしくお願いいたします。

Comments

[Cojiro]

cssに
.table th, .table td: vertical-align: middle
を記述したらいいんじゃないでしょうか？？