改行がある場合不揃いになる

質問

以下のように改行があっても下線を揃えられる方法ってないでしょうか？

<dl>
<dt>あああ</dt>
<dd>いいい</dd>
<dt>ううう<br />ううう</dt>
<dd>えええ</dd>
<dt>おおお</dt>
<dd>かかか</dd>
</dl>

dl {
padding: 0.5em 0;
width: 390px;
}

dl dt {
float: left;
width: 65px;
margin-bottom: 15px;
padding: 5px 0 8px 15px;
clear: both;
border-bottom: 1px dotted #736357;
}

dl dd {
margin-left: 80px;
margin-bottom: 15px;
padding: 5px 0 8px 10px;
width: 289px;
border-left: 1px dotted #736357;
border-bottom: 1px dotted #736357;
}

現在このような状況なのですが改行が入ると下線(border-bottom)がずれるのでバランスが悪く
なってしまいます。

全てdlでくくってやれば問題ないのですが上記の場合でも揃えられる方法がありましたら
教えてください。

回答No.2

ORUKA1951

最近のおかしな流行・・floatを使いたがる。
ここはどう見てもfloatを使う場面ではない。
display:block;position:relatoveで簡単に対処できそう。お試しを
本来はdisplay: compact;がそのためのプロパティと値なのですが、現況対応しているのはOperaだけ。
　display: run-inも使えるかもしれませんが経験なし。

回答No.1

yambejp

原則論として、dtに改行が入る時点で間違っているような気がします。
dtって定義語ですから改行って・・・

とはいえ、dtとddに同じheightを指定してやるとかそういうレベルの
対処になるのでは？（overflow:hiddenと併用するとか）