「CSSを設定したのに効かない！？」っていうことありますよね。
その場合、一概には言えませんが、もしかしたらCSSの書き方が原因かもしれません。
下記を参考に、CSSを書き直せば直る可能性もぐっと高まります！
CSSの優先度はデフォルトでは上から読み込まれるため、後から書いているスタイルが優先されます。
——————————————–
p.hoge { color: green; }
p.hoge { color: red; }
p.hoge { color: blue; }
この文字は青になります。
——————————————–
上記の場合は最後にblueを指定している為、pの文字の色は青になります。
——————————————–
.hoge2 { color: green; }
p.hoge2 { color: red; }
.hoge2 { color: blue; }
この文字は赤になります。
——————————————–
上記は最後にblueを指定していますが、その前にタグpという個別性を指定している為、優先度が高くなり文字の色は赤くなります。
裏ワザとして「!important」を使用してCSSの優先度を変更する方法もあります。
——————————————–
.hoge3 { color: green !important; }
p.hoge3 { color: red; }
.hoge3 { color: blue; }
この文字は緑になります。
——————————————–
上記は「!important」を指定して一番初めに書いたgreenを最優先に指定しています。
そのため、他の指定を無視して文字の色は緑になっています。
CSSの構築で詰まる方も少なくないかと思いますので、「CSSを設定したのに効かない！？」と感じた場合はこの記事を思い出して頂ければと思います。