<dl compact>をスタイルシートで

[新着] Webテンプレートを仮オープンしました

0   名前： 波 ： 2007/03/06（火） 21:16  ID:Muw5YedI sub-6l
いつもお世話になっておりますm(_ _)m
普通の定義型リストを、dl compact時のように一項目を一行で表示させたく、
ddとdtにdisplay:inlineを指定しました。（dt部分が長く、compactを指定しても２行になってしまうため。）
しかしこれでは
項目１：内容　項目２：内容　項目３：内容

と全ての項目が横並びになってしまうので、
<dt>項目１</dt><dd>内容</dd><br>
<dt>項目２</dt><dd>内容</dd><br>...

このように改行してみたところ、表示は上手く行ったのですが、
HTMLチェッカに文法ミスだとひっかかってしまいました。
なにか改善方法がありましたらご教授お願いします。

↓この様に表示させたいです。
項目１：内容
項目２項目２：内容
項目３項目３項目３：内容
1   名前： カヅサツ ◆ThCi95HEzw ： 2007/03/06（火） 21:16  ［URL］  ID:O5hEMlpW sub-r2
定義型リストでなく、表の方がよろしいのではないでしょうか。
2   名前： 某制作さん ： 2007/03/06（火） 21:16  ID:gFY2524F sub-Q5
dt,dd {
display:block;
}
dt {
float:left;
clear:left;
width:●●●em;
}
dd {
margin-left:●●●em;←複数行に渡る時用
_height:1%;←あまり使いたくないのですがddが複数行に渡る時のIE用
}

としてみるとイイかもしれません
但しdt内の文字数が各々異なるようなので
各々のタグにid="???"で割り振ってあげれば
固有の幅が指定できます。

display:inlineではないですが
宜しければご利用ください。
3   名前： 波 ： 2007/03/06（火） 21:16  ID:Muw5YedI sub-6l
>>某制作さん

ありがとうございました。希望の表示にできました。
複数行の時の方法、大変参考になりました。

>>カヅサツさん
今回は定義リストの方が希望の形に近いためこちらの方法をとりましたが、
ご意見ありがとうございました。
一覧へ戻る