IE7浮动bug。是否有维护html的修复程序？

Question

以下是我的问题的演示。这在Chrome和Firefox中正常运行。但是，在IE7中，未清除的浮动元素最终位于容器顶部，彼此相邻。 http://jsfiddle.net/eGAHx/

HTML：

<span class="bold floatLeft clearLeft">ISBN-13:&nbsp;</span>
<h2 class="floatLeft" itemprop="isbn">9780538735452</h2>
<span class="bold floatLeft clearLeft">ISBN:&nbsp;</span>
<h2 class="floatLeft">0538735457</h2>
<span class="bold floatLeft clearLeft">Edition:&nbsp;</span>
<span class="floatLeft" itemprop="bookEdition">3</span>
<span class="bold floatLeft clearLeft">Pub Date:&nbsp;</span>
<span class="floatLeft" itemprop="datePublished">2010</span>
<span class="bold floatLeft clearLeft">Publisher:&nbsp;</span>
<span class="floatLeft" itemprop="publisher">Brooks Cole</span>​

CSS：

.floatLeft{float:left}
.bold{font-weight:bold}
.clearLeft{clear:left}​

预期结果：
ISBN-13： 9780538735452
ISBN： 0538735457
版本： 3
发布日期： 2010年 发布者： Brooks Cole

目前的IE7结果：
ISBN-13： 9780538735452053873545732010BrooksCole
的 ISBN：
版：
发布日期：
出版商：

Answer 1

我不明白你为什么要漂浮它们。

为什么不在左边的文字中使用<strong>标记，在每行的末尾使用<br />？

Answer 2

您可以在头标记

中使用IE7这种样式代码

<!--[if IE 7]>
 <style type="text/css">
  h2{
    clear:both;
  }
 </style>
<![endif]-->

但你在h2之前给父母h2例如

yourparentelenent h2{
   clear:both
}