No.5

スタイル定義の優先順位

スタイルを優先させたくて important 属性を付けても反映されないことがある。

width: 200px !important;

そういうときはスタイルの記述順とかセレクタによる優先順位が原因になっていることが多い。

セレクタの優先順はざっと以下のようになる。

1. 後に記述されたもの
2. classセレクタ
3. IDセレクタ

順番がわかんなくなったら chrome のデベロッパー・ツールなどのインスペクタで、どのセレクタのスタイルが使われているかを確認すればOK。