0

我在使用绝对定位在表单中的信息框时遇到了一些麻烦。该页面的基本结构是我使用了一个定义列表，其中包含 DT 标签中包含的每个字段的标签和一个输入框，其中包含 DD 标签中包含的该字段的任何其他相关信息。

据我了解问题出在哪里，我有一个信息框（输入右侧的蓝色框，用于为左侧的输入提供额外信息），其中包含绝对定位的 DD 标签的一部分. 由于 DD 标签的高度被限制在输入框延伸的范围内，因此信息框被截断。不知何故，我需要扩展 DD 标签的高度，该标签有一个信息框来容纳它。

你可以在这里看到一个例子：http ://www.andbarsolutions.com/test-html/form.htm

我有两个例子，一个是信息框在最后一个输入时，所以这意味着它会悬在表单的末尾，但没关系。而第二个示例是第一个输入上的信息框，它可能会超出两个输入，具体取决于它将包含的内容量。如您所见，它在两种情况下都会中断（特别是如果您在 FF 中看到它）。我需要将 HR 标签保留在最后，因为它用于布局目的。

理想情况下，我想先看看是否有与 CSS 相关的答案，而无需求助于脚本，因为我在此页面上可以使用的脚本数量有限，如前所述，我们可以处理 1、2、3 或该信息框中有 4 行内容，因此需要将其视为具有动态高度的框。

很想听听对此的任何反馈！

4

1 回答 1

1

问题是：你overflow:hidden在 DL 上使用来清除浮动，所以绝对定位的块被隐藏了。

有几种方法可以修复它：

  • 通过任何其他方式清除浮动，例如，使用clearfix：

    dl:after {
    content:"";
    display:table;
    clear:both;
}

    并在条件注释中为 IE 添加 hasLayout：

    dl {
    zoom: 1;
}
于 2011-08-11T13:52:00.830 回答