Bugzilla

So, bottom-line: the testcase is assuming that the first "div>div" element is at least 1 line-height tall (because in the reference case, the outer div is `display:block` and so will be at least that tall).

And on Android, it is shorter than that, because there are no scrollbars. So, its parent `div` shrinkwraps its height in the testcase vs. clamps to the height of a line in the reference case.  So, the second outer `div` ends up being at a different point in the testcase vs. reference case.

One possible solution: just remove the second div altogether (it's kind of redundant -- it's a reference-that-is-included-as-part-of-the-testcase, as I understand it).

Alternative solution: don't stack these divs vertically; instead, float them horizontally, or put them in another outermost horizontal flex container. (I don't love this solution, because it seems like it's adding complexity.)

biesi, what do you think? Would you be OK with removing the second div here? (and I guess the textual description, which necessarily assumes the presence of a reference-div-inside-of-the-testcase)

So, bottom-line: the testcase is assuming that the first "div>div" element is at least 1 line-height tall (because in the reference case, the outer div is `display:block` and contains inline content, and so will be at least 1 line-height tall).

And on Android, it is shorter than that, because there are no scrollbars. So, its parent `div` shrinkwraps its height in the testcase vs. clamps to the height of a line in the reference case.  So, the second outer `div` ends up being at a different point in the testcase vs. reference case.

One possible solution: just remove the second div altogether (it's kind of redundant -- it's a reference-that-is-included-as-part-of-the-testcase, as I understand it).

Alternative solution: don't stack these divs vertically; instead, float them horizontally, or put them in another outermost horizontal flex container. (I don't love this solution, because it seems like it's adding complexity.)

biesi, what do you think? Would you be OK with removing the second div here? (and I guess the textual description, which necessarily assumes the presence of a reference-div-inside-of-the-testcase)

So, bottom-line: the testcase is assuming that its first div is at least 1 line-height tall (because in the reference case, the corresponding div is `display:block` and contains inline content, and so will be at least 1 line-height tall).

And on Android, it is shorter than that, because there are no scrollbars. So, its parent `div` shrinkwraps its height in the testcase vs. clamps to the height of a line in the reference case.  So, the second outer `div` ends up being at a different point in the testcase vs. reference case.

One possible solution: just remove the second div altogether (it's kind of redundant -- it's a reference-that-is-included-as-part-of-the-testcase, as I understand it).

Alternative solution: don't stack these divs vertically; instead, float them horizontally, or put them in another outermost horizontal flex container. (I don't love this solution, because it seems like it's adding complexity.)

biesi, what do you think? Would you be OK with removing the second div here? (and I guess the textual description, which necessarily assumes the presence of a reference-div-inside-of-the-testcase)

So, bottom-line: the testcase is assuming that its first div is at least 1 line-height tall (because in the reference case, the corresponding div is `display:block` and contains inline content, and so will be at least 1 line-height tall).

And on Android (and in the attached modified testcase), this assumption doesn't hold up -- the testcase's first div is much shorter than that, because there are no scrollbars, and it's a flex container and hence is happy to shrinkwrap the smaller height of its inner div. So, the first div has a different height in the testcase vs. reference case, which means the second outer `div` ends up being positioned at a different point.

One possible solution: just remove the second div altogether (it's kind of redundant -- it's a reference-that-is-included-as-part-of-the-testcase, as I understand it).

Alternative solution: don't stack these divs vertically; instead, float them horizontally, or put them in another outermost horizontal flex container. (I don't love this solution, because it seems like it's adding complexity.)

biesi, what do you think? Would you be OK with removing the second div here? (and I guess the textual description, which necessarily assumes the presence of a reference-div-inside-of-the-testcase)