自分の記事を見直していて、ある日、ふと気づいたことがあった。
引用マーク”や検索用の虫眼鏡マーク（当ブログだと右上に表示）が表示されていない。
いつからそうなっていたかはわからない。ネットで調べても不明。Font awesomeを昔から活用させていただいているのだが、バージョンアップによるものなのかもしれない。
こんな時はAIに聞くに限る。今はいい時代になった。
AIに聞く際、できるだけ条件を明確にする必要がある。今回の状況を調査したところ以下の通りだった。
- 虫眼鏡マークと引用マークが表示されていないが、XマークやFacebookマークは表示されていた。
- iPhone, iPadでは表示されないが、Macbook Airだと表示されていた
これをAIに聞いたところ、
1. CSSの
font-weightが指定されていない（一番多い原因）：Font Awesome 5以降では、font-weightの指定がないとiOSでアイコンが四角（□）になったり消えたりします。擬似要素（::beforeなど）で表示している場合は必ず追加してください。
とのことだった。
::beforeなどを使っている箇所でも表示されているものもあるので謎だが、試しに「font-weight: 900;」をCSSの虫眼鏡マークと引用マークのエリアに追加してみた。
すると、iPhone, iPadでもまた表示されるようになった。
なんと…
原因はよくわからないが、とりあえず直ったのでよしとしよう。
AIを使うとこういうエラー対応も早くなる。これはありがたい。
時代の変化を感じた1日であった。
久々のBlogカテゴリー記事、おしまい。
