リストやお知らせ系の一覧で上下にボーダーを引きたい場合のCSS | Cappee Design

あとで読みたい人は… @cappeeです。コーディングの復習をしていたら朝になってしまいました。 liタグを使用したリストやdlを使用したお知らせ一覧など、一覧の上下にボーダーを引きたい場合のCSSの書き方をメモします。 普通にliタグやdt、ddタグに上下のボーダーを指定すると重なったところが太くなってしまいます。 今回はdlタグを使って上下ボーダーをCSSで指定したいと思います。 [2013.3.6追加] こちら以外にも縦のリスト表示や横並びでボーダーを引きたい場合のCSSについてたくさん下記でご紹介していますのでぜひご覧ください。 CSSだけでリストや横並びの区切り線を実現するパターン4つ HTML <dl class="info clearfix"> <dt>2012.4.21 13:54</dt> <dd>お知らせですよ。</dd> <dt>2012.4.21 13:54</