IE6 HTML 控件包装

【问题标题】：IE6 HTML control wrappingIE6 HTML 控件包装
【发布时间】：2010-05-17 15:00:30
【问题描述】：

有什么方法可以防止 IE6 中的控件换行吗？例如，我有一个标签和一个选择框。选择框宽度是动态的（取决于内容）。我希望标签始终位于选择框的左侧。现在我遇到的问题是标签下方的选择框。我尝试过使用<nobr> 标记以及CSS 自动换行规则，但是因为这不是文本，所以换行规则不适用。我发现确保使其正常工作的唯一方法是将它们放在一个包含两列的表格中，但我不喜欢这种解决方案。有没有其他办法？

【问题讨论】：

下面的答案是否足够？你发现你的问题了吗？
不，但我很感激这个提示！不过，我找到了一个可行的解决方案。

标签： html controls word-wrap internet-explorer-6

【解决方案1】：

如果标签和输入都具有内联显示（“display: inline;”）并且输入换行，则可能是父容器太窄。话虽如此，典型的水平标签表单布局不依赖于这种内联显示，它们采用更可控的方法，利用块级浮动元素。例如，给定以下 HTML：

<div class="field">
    <label for="fieldId">field label</label> 
    <input id="fieldId" name="field" />
</div>

您可以使用以下 CSS 设置标签的位置：

.field {
    overflow: hidden; /* clear float */
}
.field label {
    display: block;
    float: left;
    margin: 0 5px 0 0;
}

在细节上有一个ton of variations，但上面传达了基本概念。

【讨论】：