[css]IE6での、複数のclassがあるときの個別性計算について
いま書いているcssの中で、IE6で分からないことがでてきたのでメモ。
htmlには、こういう要素が二つあるとする。
<div class="classa classb">
クラスAとBを指定
</div><div class="classa">
クラスAを指定
</div>
cssには、こう書く。
.classa {
background: #FF0000;
}.classa.classb {
background: #0000FF;
}
すると、Firefox2でもIE6でも、<div class="classa">の背景色は#FF0000、<div class="classa classb">の背景色は#0000FFになる。
ここまでは納得。
でも、cssを上下逆に書き換えてみた。
.classa.classb {
background: #0000FF;
}.classa {
background: #FF0000;
}
こうした場合でも、.classa.classbの方が個別性が高くて、同じ表示になるかと思いきや。
Firefox2では、<div class="classa">の背景色は#FF0000、<div class="classa classb">の背景色は#0000FFになるけど、IE6では、<div class="classa">も<div class="classa classb">も背景色は#FF0000になってしまうー。
まだ何も検証していないので、とりあえず忘れないように現象だけをメモしておきます。後で調べますので!
Comments
http://sonspring.com/index.php?id=102
http://www.ryanbrill.com/archives/multiple-classes-in-ie/
やっぱりそうなのですね。
こんな基礎的なことも知らず、お恥ずかしいです…。
教えてくださったページ、熟読させていただきます!