改行せず,横に続ける定義リスト

どこかにサンプルが無いかと探していたら,あった.

何かと便利な定義リスト。
用語集や、Q&Aなど使いどころは沢山あるけれど、同じ行にしたいと思うことがしばしば有るかと思います。
しかし、中々思うように横並びが出来ないのが定義リスト。

今回はそんな厄介な定義リストのサンプルを作ってみました。

dlのdt dd を横並びに - CSS HappyLife

ということで,下記コードが例示されていた.

dl {
 border:1px solid #999;
 width:390px;
}
dt {
 float:left;
 width:100px;
 padding:5px 0 5px 10px;
 clear:both;
 font-weight:bold;
}
dd {
 width:260px;
 margin-left:100px;
 padding:5px 5px 5px 10px;
 border-left:1px solid #999;
}