css - 在IE 7中将<dl>清除为<dd>之前？

我正在尝试创建一个<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>都向左 float ，并清除每个<dt>，但不幸的是，这在IE 7中不起作用。

我已经尝试了所谓的神奇clearfix，但无济于事。这适用于Firefox和IE 8。

还有其他可行的方法(最好不要过多更改HTML)吗？谢谢!

最佳答案

从dl.icons dd删除float:left

关于css - 在IE 7中将<dl>清除为<dd>之前？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/3515226/