html - 为什么这个简单的 float 定义列表在 IE7 中不起作用，如何修复它？

Question

This is a very simple dl .

HTML

<dl id="photo-attributes">
<dt>Edition</dt>
<dd>200</dd>
<dt>Ratio</dt>
<dd>3:1</dd>
<dt>Location</dt>
<dd>Great ocean road, Victoria</dd>
<dt>FStop</dt>
<dd>F-32</dd>
<dt>Exposure</dt>
<dd>3 minutes 40 seconds</dd>
</dl>

CSS

#photo-attributes {
  margin: 1em 0;
  overflow: hidden;
}

#photo-attributes dt {
  width: 10em;
  float: left;
  clear: left;
  font-weight: bold;
}

#photo-attributes dd {
  float: left;
}

它在除 IE7 之外的所有版本中都能按预期工作。 dd float 在一行上。我不记得这是 IE7 中的什么错误。

我该如何解决这个问题？谢谢

Answer 1

这与 haslayout bug 相关。但毕竟dd不需要左浮动。删除它。