在IE 7中<dd>之前<dl>清除？

Question

我正在尝试创建一个<dl>来定义我在页面上使用的图标.我想要它,以便每个图标都在一个内部<dt>,它的定义在下面<dl>.在每个图标定义之后,我想要一个换行符.简单吧？好吧,IE7说没有!

这是我的HTML:

        <dl style="display: block;" id="surveysIcons" class="icons">
            <dt class="clearfix"><span class="icon"><img alt="Complete" title="" src="images/fiq_complete.png"></span></dt>
            <dd>You have completed the survey</dd>

            <dt class="clearfix"><span class="icon"><img alt="Incomplete" title="" src="images/fiq_incomplete.png"></span></dt>
            <dd>You have missed the survey</dd>
        </dl>

这是我的CSS:

dl.icons {
    margin: 0 0 1em 0;
    padding: 0;
    width:100%;
    overflow:hidden;
    line-height:24px;
    clear: both;
} 
dl.icons dt {
    clear:left;
    margin:0;
    float:left;
    min-height:24px;
}
dl.icons dd {
    padding: 3px;
    margin: 0 0 0 5px;
    float:left;
    min-height:24px;
}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {display: inline-block;}  /* for IE/Mac */

我的方法是浮动左侧<dt>和<dd>左侧,并清除每个<dt>,不幸的是,它在IE 7中不起作用.

我尝试过所谓的神奇clearfix,但无济于事.这适用于Firefox和IE 8.

任何其他可能使这项工作成功的想法(最好不要改变太多的HTML)？谢谢!

Answer 1

从dl.icons dd中删除float:left