[csswg-drafts] [CSS2] Adjoining margins when parent min-height is non-zero

mstensho has just created a new issue for https://github.com/w3c/csswg-drafts:

== [CSS2] Adjoining margins when parent min-height is non-zero ==
https://www.w3.org/TR/CSS22/box.html#collapsing-margins

Given the following example:

```
<div id="parent" style="min-height:200px; background:skyblue;">
  <div id="child" style="height:50px; margin-bottom:100px;"></div>
</div>
<div id="successor" style="height:20px; background:salmon;"></div>
```

Should the bottom-margin of #child and #parent be considered to be adjoining? All the spec seems to have to say is that "bottom margin of a last in-flow child and bottom margin of its parent if the parent has 'auto' computed height" are adjoining. In this case the height is auto, so then they are adjoining. But it really makes no sense. It's pretty clear that those two margins aren't really adjoining. After all, the bottom margin of #child is in the middle of the border box of #parent, since it's stretched by min-height.

Currently, Chrome and Edge seem to follow the spec, and treat them as adjoining (and you get a white gap between #parent and #successor in the example above), while Firefox doesn't treat them as adjoining. What Firefox does makes a lot more sense, but it's not covered in the spec, as far as I can tell.

See also [crbug.com/832016](url)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2607 using your GitHub account

Received on Monday, 23 April 2018 11:32:59 UTC