【WordPress】スマホサイズにした際に「table」が崩れてしまう時の対処方法!(「display:block」を使ってセルを改行する)

通常のWordPressでは「.wp-block-table td」「.wp-block-table th」が横並びになっており、
スマホサイズにしたときも横並びのままで、狭くなって見えづらいです。

今回はCSSを1つ加えるだけで、スマホサイズにしたときに簡単に改行される方法をまとめます。

目次

追加CSS

以下の書き方で、PCサイズからSPサイズに変わった時に自動で改行され、レイアウトが綺麗に切り替わるようになります。

@media (max-width: 959px) {
	.wp-block-table td,
	.wp-block-table th{
		display: block;
		width: 100%;
	}
}
よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次