Twitter Bootstrap の CSSを上書きすることができなかった。
理由は、CSSセレクター適用優先順位の知識不足・・・。
CSSはセレクターを読み込む順番で何を適用させるかを決定する。
基本的に後で読み込まれたものが優先される。
というか、上書きされていく、
なので、今までは最後に自分のCSSファイルを読み込ませてた。
自分のCSSファイルを最後に読み込ませることで、
上書きされるだろうと・・・。
ところが、セレクター自体にも優先順位があり、
それによっては上書きされない。
セレクターではタグセレクターが強いらしい。
なので、以下のようなCSSの場合、.test のCSSは適用されない。
td { color:#000; } .test { color:#fff; }
この場合は以下のようにする。
td { color:#000; } td.test { color:#fff; }
Twitter Bootstrap のCSSを上書きするときは、
有効になっているCSSセレクターをそのまま抜き出して、
自分で任意の class or id を指定する。
以下は自分で .middle を追加した。
これで td + class="middle" では以下のCSSが適用される。
.table tbody>tr>td.middle { vertical-align:middle; }