CSS';溢出:隐藏';是否强制元素(包含浮动元素)环绕浮动元素?

CSS';溢出:隐藏';是否强制元素(包含浮动元素)环绕浮动元素?,css,Css,有人知道为什么“溢出:隐藏”强制带有浮动元素的元素包装元素吗 我真的很想了解它的内部工作原理,而不仅仅是使用它和相信“它只是工作” 我可以理解当包含元素与浮动的子元素在同一方向浮动时,它是如何工作的,但是overflow:hidden意味着裁剪溢出内容(与position:absolute/relative一起使用时) 欢迎提供任何信息。CSS2规范的详细说明: 表的边框框、块级替换元素或建立新块格式上下文的正常流中的元素(例如具有“溢出”而非“可见”的元素)不得与元素本身在同一块格式上下文中的

有人知道为什么“溢出:隐藏”强制带有浮动元素的元素包装元素吗

我真的很想了解它的内部工作原理,而不仅仅是使用它和相信“它只是工作”

我可以理解当包含元素与浮动的子元素在同一方向浮动时,它是如何工作的,但是overflow:hidden意味着裁剪溢出内容(与position:absolute/relative一起使用时)

欢迎提供任何信息。

CSS2规范的详细说明:

表的边框框、块级替换元素或建立新块格式上下文的正常流中的元素(例如具有“溢出”而非“可见”的元素)不得与元素本身在同一块格式上下文中的任何浮动重叠。如有必要,实现应通过将所述元素放置在任何之前的浮动下方来清除所述元素,但如果有足够的空间,则可将其放置在此类浮动附近。它们甚至可能使上述元件的边框比第10.3.3节规定的更窄。CSS2没有定义UA何时可以将所述元素放置在浮动旁边,或者所述元素的变窄程度


好吧,似乎没有“实际”的解释来解释为什么会发生这种情况(我无论如何都无法理解——例如,在一个回复中提供的CSS规范摘录只是解释了一个带有浮动内容的框不应该展开来包装浮动元素——这很好,这是合乎逻辑的,我完全理解)

我希望这不是什么随机的攻击,它迫使父元素包装它的浮动子元素,但似乎我看到的每一个资源都只是说使用它,而不是它为什么工作

一定是个黑客

我遇到的最有用的资源(或提供了最多细节的资源——尽管没有我需要的那么多细节)来自Quirksmode:

如果其他人能够解释这是一个随机的浏览器渲染怪癖,还是对它的工作方式有一个合理的解释,那就谢谢了

M

浮动,绝对定位 元素、内联块、表格单元格、, 表标题和带有 “溢出”而不是“可见” (除非该值已 传播到视口)建立 新的块格式上下文

在块格式化上下文中,每个 长方体的左外边缘与左侧接触 包含块的边缘(用于 从右到左格式化,右边缘 触摸)。即使在现实生活中也是如此 浮子的存在(尽管是一个盒子) 线路盒可能会因以下原因而收缩: 浮动),除非该框建立 新块格式上下文(其中 箱子本身可能会损坏 因浮子而变窄)


块格式上下文清除浮动。来源:

对于记录:
溢出
的任何值(除了
可见
)都可以;根据CSS规范。关于这个问题,请参见quirksmode:对不起,我收回了我的评论,我完全错读了。我道歉!谢谢你把这件事告诉我,因为我会完全错过的。你应该解释一下,这是一个更好答案的例子