Firefox ではdtの中にdlを入れ子にして
dl dt dl dt {
margin:0;
〜〜〜〜
}
margin:0;
〜〜〜〜
}
のような指定はできない。
これはバグではなく、仕様通りです。
なぜならdtの内包可能要素はインライン要素だけであるからです。
DDの中にDL、DTを入れ子にするのは違反ではありません。
[参考記事] <DT> HTMLタグ辞典
[参考記事] <DD> HTMLタグ辞典
対象ブラウザ
Windows
Firefox
Mac
Firefox
回避方法
(1) DTの中にDLやDTを記述すること自体が文法違反なので、このような書き方をしない。
(2) どうしても指定したい場合には次のようにします。
HTML
<div id="test">
<dl>
<dt>
<dl>
<dt>テスト</dt>
<dd>テスト</dd>
</dl>
</dt>
<dd>テスト</dd>
</dl>
</div>
<dl>
<dt>
<dl>
<dt>テスト</dt>
<dd>テスト</dd>
</dl>
</dt>
<dd>テスト</dd>
</dl>
</div>
CSS
/* 次のようにして入れ子の指定を書く */
div#test dl {
}
div#test dl dt {
}
div#test dl dd {
}
/* 次のようにして入れ子の指定を上書きし、親要素の指定を書く */
div#test>dl {
}
div#test>dl>dt {
}
div#test>dl>dd {
}
div#test dl {
}
div#test dl dt {
}
div#test dl dd {
}
/* 次のようにして入れ子の指定を上書きし、親要素の指定を書く */
div#test>dl {
}
div#test>dl>dt {
}
div#test>dl>dd {
}
関連プロパティ
主要ブラウザに非対応
