dtの方が高さが有る時のdt dd を横並び

久々に定義リストを横並びにしたら、IE7で上手くいかず、ちょっと苦戦したのでメモめもMEMO。 おそらく、ddがテキスト量などで高さがdtより多い場合は問題が無いんだろうけど、dtの方が高さがある場合、IE7だと上手い具合に回り込みが解決されない（っぽい dtの方が高さがある場合。っていうのは今回の場合は画像にdtが来て、ソレを定義付ける説明がちょろっとあるようなイメージ。 実際の表示は下のような感じ。 SQ Lifeのバナーです。 SQ Lifeのバナーです。 スタイルは以下のようになられます。 dl#sample_070228 dt { float:left; clear:both; width:125px; margin-right:10px; margin-bottom:20px; border-bottom:0; } dl#sample_070228 > dd { float:l

[ke-tu]

dldtdd

[bascinet]

目から鱗

[shukaido170]

画像とキャプションによる横並びスタイル。こういうサンプル探すのに苦労した。

[kyorecoba]

単純にfloatを使った例だとシナリオ風会話文がありました。画像とそのキャプションという使い方は今後積極的に使って行きたいものです。