優先順位に気を付けて | 長期有給インターン生の日常|株式会社ガーディアン | 株式会社ガーディアン｜141億のデータで中小企業を勝たせるWEB戦略データ・カンパニー | 株式会社ガーディアン｜141億のデータで中小企業を勝たせるWEB戦略データ・カンパニー

みなさん、こんにちは！
京都事業所受託プロダクトチームインターン生の肖かえいです😆

今日、課題に取り組むうえで一つの壁にずっと止まっていました。

それはメディアクエリで新たに設定したのに反映されない‼

あれこれCSSで試行錯誤しても全く反映されない😓😓

これの原因は何だったのかというとメディアクエリの優先順位が後の方になっていたからでした。

この優先順位が後の方になっていた場合解決策は、

➀!importantで重要な指定をする
②プレーンのcssに書くのではなく、min-widthとmax-widtnでそれぞれ指定して書く

となります。一見➀の方が簡単に見えますが、

➀の方法ですと保守性を低下させてしまう危険性があることに気を付けなければなりません。

②の方法ですとメディアクエリのみで指定するので、そもそも優先順位は関係なくなります。
メディアクエリが効かないときには、優先順位の問題なのかもしれませんね！
---------------------------------------------------------------------------------------------
インターン募集ページ: https://guardian.jpn.com/recruit/intern/
メンバー紹介ページ：https://guardian.jpn.com/member/Xiao_Kaei/
---------------------------------------------------------------------------------------------