触发了BFC但还是发生了margin-collapsing

Question

按照之前的理解的同一个BFC下的两个兄弟元素A和B原本存在margin折叠，但是如果A和B都生成了自己的BFC，就会使margin折叠失效

但这里有个小demo

可以发现有两个触发BFC的属性可以消除margin折叠

• display: inline-block

• float

但是这些却不行

• display: flex/table-cell

• overflow: hidden

请问这是为什么呢？

Answer 1

再贴一下这个链接

Answer 2

以下MC代表margin-collapsing

目前了解到的是这样：

1. 产生BFC的盒子不会与子盒子产生MC

2. display: inline-block的元素不与兄弟元素和父元素发生MC（因为inline-block生成的是IFC）

3. position: absolute和float元素不与兄弟元素和父元素发生MC, 但是会与后一个产生了BFC的但没脱离文档流(in-flow)的产生MC