定義リストで先頭にアイコン

質問

先頭にアイコンをつけたいのですが、テキストが重なってしまいます。
できれば下記のように定義リストで実現したいです。

.qaarea dl {
margin: 1em;
padding: 0;
}

.qaarea dt {
font-weight: bold;
color: #035AA3;
background: #CCCCCC url(../qa_img/q_back.gif) no-repeat left center;
padding: 5px;
}
.qaarea dd {
background: #FFFFFF url(../qa_img/a_back.gif) no-repeat left top;
padding: 5px;
margin: 10px 0 10px 50px;
}

-------------
<div class="qaarea">
<dl>
<dt>質問が入ります。</dt>
<dd>回答が入ります。</dd>
</div>

回答No.1

hachi_08 · ベストアンサー

ざっと見ただけなのですが、dtとddにアイコンの幅より大きい
padding-leftをつけてみてはどうでしょうか？

お礼

できました♪
ありがとうございました！！