CSSを多重継承してみる

りんごりらのエントリーで使ったCSS多重継承だけど、2コまでかなーと思ってたらそれ以上もいけるっぽい。

.text-red{
color:#c00;
}
.text-bold{
font-weight:bold;
}
.bdr-dbl{
border:3px double #999;
}
.w300{
width:300px;
}
.text-underline{
text-decoration:underline;
}

こういうスタイルを用意した上で、<div class="text-red text-bold bdr-dbl w300 text-underline">りんごりら2!!!!<div>と書いてみる。
予想では2重枠線で幅300pxのDIVのりんごりらが赤くて太字で下線が入っている、というものができるはずなんだけど…
で、結果は以下に続く!!