html - 为什么这个清晰:both acting globally?

Question

问题

据我所知，清除 float 主要作用于父项。但是在帖子缩略图之后我的模板中存在一个问题，其中 clear: both 作用于整个内容包装器。如果不清除 float ，细线会粘在缩略图右侧的文本上。

我想要做的是在缩略图或文本下方放置 45px 的线(取决于更高的高度)。

预览

请有一个 look at this sample .

非常感谢任何帮助!

Answer 1

只需使用 overflow: hidden; hack 来结束 float。

将 CSS overflow: hidden 添加到父元素。

编辑

作为奖励。如果你想使用一些花哨的 CSS3 东西(比如阴影)，上面的 hack 将失败。

有一个新的 hack:http://fordinteractive.com/2009/12/goodbye-overflow-clearing-hack/

虽然这个 hack 也有一些问题。

而且您可能需要一些时间才能认真使用花哨的 CSS3 内容。

你可以使用它，但浏览器支持将很长一段时间很差:)