table,thの中身にvertical-alignが効かない

Question

前提・実現したいこと

'コース詳細'を上下中央に配置したいです。

Bootstrap4 で表を作っています。
セルに対して文字を上下中央に表示したいのですが、heightを指定してvertical-alignを指定してもうまく行きませんでした。
初歩的な質問だとは思いますが、ご教授お願い致します。

該当のソースコード

<table class="table table-bordered text-success estimate__table__border">
　<tbody>
　　<tr>
　　　<th class="estimate__table__border estimate__table__body text-white estimate__table__row">
　　　コース詳細
　　　</th>
　　　<td class="estimate__table__border">
      <textarea name="course__detail" id="course__detail" cols="50" rows="10" class="estimate__textarea"></textarea>
      <p class="text-danger">テキスト</p>
      <p>テキスト</p>
      <p>テキスト</p>
     </td>
　　</tr>
　</tbody>
</table>

.estimate__table__border{
  border:1px solid #31A05E !important; 
}

.estimate__table__body{
  width: 200px;
  background: #31A05E;
  font-weight: normal;
  vertical-align: middle;
}

.estimate__textarea{
  vertical-align: middle;
  border:1px solid #31A05E !important; 
  width: 100%;
  margin-bottom: 20px;
}

.estimate__table__row{
  height: 400px;
  vertical-align: middle;
}

試したこと

'コース詳細'をdivで囲ってそれに対してvertical-alignを試すなど、検索をして色々行いましたが、うまく行きませんでした。

補足情報（FW/ツールのバージョンなど）

bootstrap4 最新

Comments

[kei344]

まだ質問が「受付中」になっていますが、いったん「解決済」にされてはいかがでしょうか。また、解決されていないなら状況を質問文に追記ください。

Answer 1

詳細度の問題では？

.table .estimate__table__row {
  height: 400px;
  vertical-align: middle;
}

【詳細度 - CSS: カスケーディングスタイルシート | MDN】
https://developer.mozilla.org/ja/docs/Web/CSS/Specificity

Comments

[strexxx]

単純なところを見落としていました。
解決して頂きありがとうございます。