1508970 - Child element margin-bottom collapses through padding-bottom of scrolling parent

Status: RESOLVED DUPLICATE of bug 748518

(Core :: Layout: Block and Inline, defect)

Description

[rhino.citguy]

Attachment: FF-MarginCollapseScrolling-scrolled-to-bottom.png

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:63.0) Gecko/20100101 Firefox/63.0

Steps to reproduce:

1. Open https://codepen.io/CITguy/pen/dQJQQO
2. Scroll to the bottom of the container in Test 3
3. Scroll to the bottom of the container in Test 4


Actual results:

* Bottom white space for Test 3 ignores padding-bottom of the parent DIV.
* Bottom white space for Test 4 ignores padding-bottom of the parent DIV.



Expected results:

* Bottom white space for Test 3 should match that of Test 1.
* Bottom white space for Test 4 should match that of Test 2.

Comment 1

[rhino.citguy]

As far as I can deduce, it appears that Firefox is collapsing the bottom margin of the last <p> with the bottom margin of the scrolling <div>.

Margin collapsing should only apply to adjoining margins, and according to spec, two margins are adjoining if “no line boxes, no clearance, no padding and no border separate them” (among other conditions).

In this case, there is padding between the two margins, so margin collapsing shouldn’t occur.

----------

SPEC: https://www.w3.org/TR/CSS2/box.html#collapsing-margins

Comment 2

[Emilio Cobos Álvarez [:emilio]]

I think this is not a margin collapsing issue, this is just bug 748518, which has a lot of other discussion. Do you agree?

Comment 3

[rhino.citguy]

Yes, it seems like it's the same issue.