使用CSS清除最后一个浮动元素?

时间:2010-11-25 03:25:15

标签: css internet-explorer css-float

我在另一个div中有一个浮动div的集合。子div具有可变的宽度和高度 - 即使用我无法控制的动态数据填充它们。现在有时会发生什么情况,如果最后一个子div具有一个带有文本墙的巨大高度,因为它被其他div强制为一个小宽度。这只发生在IE 6,7,8 - FF3.6正确处理它 - 它确保巨大的div在一个大宽度的换行后开始。

无论如何我可以强迫IE进入同样的行为吗?

2 个答案:

答案 0 :(得分:1)

实际上,如果为浮动div指定宽度,那么它将使用该宽度,否则浮动div将“收缩包裹”到内容。所以你可以试试,或者你可以将这种风格用于那个浮动:

#the-last-div { clear: both; float: left }

如果您希望它自己遍布整个页面,您可能会或可能不希望它浮动。

答案 1 :(得分:1)

唯一的解决方案是三个中的一个:指定clear:both;,指定默认宽度,或使用jquery / javascript动态地执行其中一个或两个。只要您让内容决定高度和宽度,您就会遇到问题。

使用clear:both;在所有div上将每个浮点数放在自己的行上。这听起来不像你想要的那样。

指定宽度将是最可预测的。浏览器将遵循宽度,如果没有足够的空间,将清除到下一行。

如果要动态加载需要特定宽度的内容,那么适当地动态调整包含div宽度应该是微不足道的。您可以检查内容的长度,并在内容太长的情况下为接收内容的div指定宽度。由于我们没有您的代码,您必须尝试使用​​长度和宽度才能使其正确。

您正在加载简单文本的内容是否包含div和其他块级元素? 它是如何浮动的?它是浮动的混合物:左;和浮动:对; ?或者这一切都在一边?