cssを変更したはずなのに変更したcssが効いてないことがありますよね。今回かなりハマったので、健忘録としてまとめておきます。 今回以外にも、過去に何度かCSSが効かなくてハマったことがあるので、CSSが効かない時に私が通常チェックする箇所をまとめました。 今回の症状 WordPressでスマホ用の表示メディアクエリ（@media）を使った部分のcssを変更したのに、PCのChromeで確認したらcssが反映されているのに、safari、iOSのChromeとsafariともcssが反映されていない。 CSSの記述がおかしくないか 全角スペース / “（ダブルクォーテーション） よくある記述ミスの中でも見つけにくいものが、本来なら半角スペースで記述しなければいけない箇所を全角スペースで記述している場合です。 上のコードには「display: none; 」の前のスペースが全角になっています。肉眼で確認するのは難しく、見落としてしまうことが多いので気をつけましょう。正しくはこちら。 また、ネットやノートアプリなどからコピペした時など、”（ダブルクォーテーション）が全角になっている時があります。こちらもよくあるミスです。 上のコードの”は全角になっています。正しくはこちら。 idとclassを間違えている こちらもよくあるミスですが、idで指定したのにCSSの方ではclassで記述している場合、もしくはその逆です。 上のコードではHTMLにclassを指定しているのにも関わらず、CSSではid指定の記述をしているのでCSSが反映しません。正しくはこちら。 コメントアウトの記述は正しいか これも過去実際にあった間違いですが、コメントアウトが正しく記述されていませんでした。 上のコードには「/」の後に半角スペースが入っているので、その後のCSSが認識しません。正しくはこちら。 コードがしっかり閉じてるか CSSの一部を削除した場合など、片方の「}」が残ってしまったり、末尾の「}」が削除されてしまったりすることがあります。特にメディアクエリの「}」を閉じ忘れると、それ以降のCSSが効かなくなるので、コードがしっかり閉じてるか確認します。 上のコードは最後の「}」が閉じ忘れています。正しくはこちら。 更新時にスーパーリロード（強制更新）しているか CSSを変更した後、通常の更新だけだと変更したCSSが反映されないことがあるので、確認するにはブラウザ上からスーパーリロード（強制更新）する必要があります。…