WordPressテーマSANGOの質問

FontAwesomeを使用した見出しのスマホ表示について

アバター
なやみのたね

FontAwesomeを使用して見出しに組み込み場合で2つ程不明点があります。
・スマホ版で表示を見るとアイコンが左画面に埋まってしまいます。
・見出しが2列になった場合、見出しの上下中心にアイコンを表示させたいです。
「CSSのコピペだけ!おしゃれな見出しのデザイン例まとめ68選」でサルワカさんが使用されているL2のような表示にしたいのですが、どのようなコードを追記すれば反映されますでしょうか?
初心者的な質問ですみません。よろしくお願いします。

SANGOでデフォルトの見出しを変える方法
コメントへの回答
サルワカくん
サルワカくん
2020/06/13

h3見出しをカスタマイズされていると思います。このうち

.entry-content h3:before {
~
}

の中の
left: -1.35em;

left: 0:
に変更し、

.entry-content h3 {
~
}

の中の
padding: 2px 5px 2px 20px;

padding: 2px 5px 2px 45px;
に変えると良いと思います。

よろしくお願いします。


なお、アイコンが表示されない場合、

.entry-content h3:before {
~
}

の中にfont-weight: 900;という行を追加すると表示されるようになると思います。