CSSでdlのdt ddを横並びにする - ネガティブマージン編 - | A Day in the LifeApril 27, 2010 過去に2回ほどCSSでdlのdt ddを横並びにする記事をこのブログにポストしました。 定義リストdt ddを横並びで表示させる 再び定義リストdt ddを横並びで表示させる 過去の記事は2つともfloatを利用しましたが、ネガティブマージンを使った方がCSSコードもシンプルになるのでおススメです。 まずdl要素のline-heightプロパティで行の高さを指定します。dd要素のmargin-topプロパティにdl要素で指定したline-heightプロパティと同じ値のネガティブマージンを与えればOKです。 dl { line-height: 1.5; } dd { margin: 0 0 1.5em 0; padding-left: 9em; } dt + dd { margin-top: -1.5em; } dtに対してddが一つならば一番下のdt+dd
