Html FF和IE中完全忽略了负边距底部。这是错误吗？

让我首先说，我不需要帮助解决这个问题-我可以轻松地解决我自己的具体问题。但我确实需要帮助理解为什么会发生这种情况——并可能确定它实际上是一个bug，这样我才能报告它

问题是带有

溢出的父容器：隐藏的
包含一个子容器，该子容器的
边距底部为负值
，而该子容器又包含一个或多个
浮动的
ed项，后跟一个
清除的
（即，它的高度取决于浮动的子容器）。。。似乎完全忽略了负的底部边距

我不希望child div的内容对负底边起任何作用。。。无论孩子里面是什么，我都希望负边距得到尊重，内容被父母的
溢出：隐藏
所“切断”

TL；DR：下面有一个更简单的例子

本例显示了FF和IE中的问题-但与我在chrome中的预期完全一样：


*{
框大小：边框框；
}
身体{
背景：番茄；
}
.家长{
溢出：隐藏；
背景：一枝黄花；
宽度：25%；
利润率：0.12.5%；
浮动：左；
}
.parent.overflow_可见{
溢出：可见；
}
.孩子{
利润上限：-10px；
保证金底部：-10px；/*这一项对FF和IE没有影响*/
}
.浮动{
高度：100px；
浮动：左；
边框顶部：15px纯绿；
边框底部：15px纯绿；
宽度：100%；
}
.清楚{
明确：两者皆有；
}
.清除下面的{
明确：两者皆有；
背景：黄色；
高度：10px；
}
这似乎是Chrome中的一个bug

让我们从顶层分解您的示例。您的
.parent
容器是块格式上下文根，因为它们是
float
ing（CSS2.x规范的）。其指定的
高度
为
自动
（默认值）。据报道,

…如果元素有任何浮动子体，其下边距
边低于元素的底部内容边，则高度为
增加以包括这些边缘

浮动子体（
.float
元素）的底边距边缘是它们的底边距边缘，因为它们自己的底边距为零。规范没有说明任何关于浮动子体的中间块包装的内容，因此
.child
元素的高度小于
.float
元素的高度这一事实不应影响容器的高度，并且由此产生的容器高度应由浮动元素的高度确定（包括它们的边框）。这是我们在其他浏览器中看到的，如果我们从
.clear
元素中删除
clear:both；
属性，这也是我们在Chrome中看到的

然而，
clear
ing块的存在在某种程度上改变了Chrome中容器的行为。似乎浏览器“决定”浮动元素下面有一些内容，并开始表现为高度是由该内容决定的，“忘记”浮动元素的底部边框实际上位于容器本身的底部内容边缘之下（位于
.child
的底部边距边缘）

因此，如果要剪裁块格式上下文根的浮动子体，最好将负边距设置为这些浮动元素本身。
浮动就是这样工作的：浏览器通过内部增加清除元素的上边距来清除浮动，直到其顶部与浮动元素的底部齐平一个。@MrLister Err…我对浮点数是如何工作的并不感到困惑（或者至少我不这么认为）。显然，
clear
应该低于浮动本身，因此将子对象的底部延伸到浮动下方…但这不应阻止子对象上的负底部边距产生任何影响…因此父对象的底部应该比子对象的底部高10px（和clear）.撇开所有细节不谈，Chrome和firefox在渲染方面有着非常明显的区别，如果这是“浮动的工作原理”，则不应如此.我觉得这是非常违反直觉的，所以我努力去论证…我已经阅读了10.6.7好几次，并试图找到与你的结论相矛盾的东西。我不习惯阅读这些东西…但是：“只考虑参与此块格式上下文的浮点数。”“中间块包装器”你指的是（即我所说的
.child
）…如果不建立一个新的块格式上下文-这意味着错误实际上在FF中…？如果它有
显示：flow root/inline block/table/table cell/flex/grid
，
溢出：hidden/auto
，
float:left/right
，any
列计数
，或者如果它是
字段集，它将建立新的BFC
element。但在您的示例中，它只是一个常规块，与它的子体一起参与其父BFC。我同意，这是超反直觉的。在我看来，CSS中的浮动/清除几乎所有内容都是如此！这是非常正确的：p