文本未包装到IE 6和7中正好浮动的元素

Question

我有下面的HTML和CSS，我试图让.metadata向右浮动，文本环绕它。它适用于Firefox和当前版本的IE，但在IE6和7中，文本没有包装。 “元数据”框浮动到右侧，但无论元数据框的高度如何，它也会将文本向下推动那么多，文本将跨越#container的宽度。

在当前浏览器中，文本环绕.metadata框。

#container { width: 960px; margin:0 auto;}
.metadata { float: right; width: 500px; }

<div id="container">
    <div class="metadata">
        <div class="metadataRow">
           <div class="metadataLeft">Name: </div>
           <div class="metadataRight">Lorem ipsum</div>
        </div>
    </div>

    <p class="text">Lorem ipsum </p>
</div>