Houn

li-comma
2019.08.17

Web制作メモ

横並びのliタグをカンマで区切る方法

WordPressのウィジェット設定でカテゴリを設置すると、デフォルトではこんな表示になるのを↓

cat-li-default

こういう、横並びにして且つカンマで区切ってあげる表示にしたかったので↓

cat-li-comma

以下、そのCSSの書き方です。

CSSの記述

cat-itemって、カテゴリウィジェットを設置するとそれぞれのカテゴリ項目(liタグ)にWordPressが自動で当ててくるクラス名ですね。それをdisplay: inline-block;で横並びに切り替えます。

で、あとはコメントの通りといったところですね。

Share on SNSシェア

Related 関連記事