本カスタマイズの
ポイント
WordPressテーマのSWELL（スウェル）では表組みをスクロールできる機能がありますが、横のセル数が多くなると表組みが崩れてしまうことがあります。これをCSSで調整します。
本カスタマイズの
効果・メリット
表組みスクロールが綺麗に見えるようになります。
本カスタマイズの
評価
| 難易度 | Lv2 |
| やること | CSSの追加 |
| 所要時間 | 5分 |
| ツール名 | なし（CSS調整） |
| 費用 | 0円 |
| 注意点 | 特になし |
SWELLの表スクロールを一段にする方法
改善前
以下のように表組が崩れた状態です。セル数が多い場合に起きています（セル数が少ない場合は起こりませんでした）。
SWELLの表スクロールを一段にする方法
改善後
表組みが一段になり、綺麗にスクロールできます。実際のデモサイトはこちらです。スマホ状態にしてご覧ください。
SWELLの表スクロールを一段にする方法
設定方法
- ステップ１CSSに以下を追記します。これで表組みが段ずれすることなく綺麗にスクロールするようになります。
.wp-block-table.sp_scroll_ { white-space: nowrap; }
ユウコ
これでおしまいだよ！表組みスクロールはきれいになったかな？もし、役に立ったらツイート、はてなブックマークしてくれると嬉しいな。
0