我有2个div。红色是float:left（宽度：100px）

绿色div为margin-left:101px（不浮动）

enter image description here

在绿色 div中，我添加了一个带有2个浮动元素的div：

enter image description here

结果是：

enter image description here

一切都好。

但如果我在div添加clear:both：

enter image description here

红色div的底部超出：

enter image description here

我的问题是为什么是这样的？

我知道clear:both应该不允许在两个位置和正确位置使用任何浮动元素但在同一个容器下 !!

我们在这里谈论绿色div容器。为什么清楚：两者都考虑红色div？这超出了他的范围！

任何帮助？

（我正在寻找原因。另外 - 如何更改clear:both以满足需要）

P.S。

红色和绿色div的CSS是强制性的。这就是网站目前的构建方式。

编辑：

我发现如果我把float:left放在这个：

enter image description here

它的行为应该如此：

enter image description here

（这里发生了什么......？）