WordPressのTablePressで上下中央寄せが出来ない時の対処

WordPressにはTableを作る際に活用できる便利なプラグインとして、TablePressがある。
このプラグインを使うと、動的で美しいTableの作成が可能となる。

ただし、先日、問題に直面したのは、上下中央寄せが出来ないという事案だ。
セルの縦幅を広くした時に、セル内の文字列が上寄せのままで、中央に設定できなかった。

対処としては、TablePressのカスタムCSSに設定した部分に「vertical-align:middle;」を設定すれば良いのだが、これが一筋縄ではいかなかったため、備忘録として残す。

参考サイトは以下のものだ。
WordPress › Support » Vertical align problems in css

シンプルに、
.tablepress-id-2 td{
    vertical-align:middle; 
} 
という設定では、上下中央寄せにはならなかった。
そんなときは、td要素の親要素も指定すると良いらしい。
具体的に言えば、
.tablepress-id-2 tbody td{
    vertical-align:middle;
}
である。 td要素だけではなく、tbody要素もCSSの部分で記述してあげることで、この問題を解決することができる。
参考までに。

2 件のコメント on "WordPressのTablePressで上下中央寄せが出来ない時の対処"

  1. 困っていたところうまく設定できました!!ありがとうございました。

    返信削除
  2. 神記事でした!!ありがとうございます!

    返信削除