David Shin
c35c146cbd
This means that when users scroll to the inline-end of a scroller, they will see that the inline-end padding of that scroller is added in. This is achieved by unioning an additional rect into the scrollable element's overflow area (Which is an accumulation of the recursive overflow-area contributions from its subtree). This additional rect is calculated as follows: - In-flow children and float's margin boxes are unioned (including zero-size boxes) - The unioned rect is then inflated by the scrollable element's padding Note: The bounds of zero-area in-flow-child rects are included in this rect, in both block- and inline- directions. This is a change in behavior; Divs of huge inline size and zero block size used to not affect the scrollable overflow, where divs with huge block size and zero inline size did, as a side effect of now removed `nsBlockFrame::ConsiderBlockEndEdgeOfChildren`. Note on WPT change sizing-orthog-(vlr|vrl)-in-htb-(008|020)-ref.xht - the padding existed to force empty space below `p#sentence-after`. However, this only applies to previous Firefox. Any combination of browser + default font (+ its default size) causing a scroll would cause the test to fail as false positive (According to wpt.fyi, this is what happens with sizing-orthog-(vlr|vrl)-008.xht tests). This change brings Firefox's scroll behaviour inline with other browsers. Differential Revision: https://phabricator.services.mozilla.com/D151310
26 lines
614 B
HTML
26 lines
614 B
HTML
<!DOCTYPE HTML>
|
|
<html><head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
|
<title>Testcase for bug 1768921</title>
|
|
<style type="text/css">
|
|
|
|
html,body {
|
|
color:black; background-color:white; font-size:16px; padding:0; margin:0;
|
|
}
|
|
|
|
x1,x2,x3,x4,x5,x6 { display:block; }
|
|
x2 { overflow:auto; width:100px; background:grey; }
|
|
x4 { width: 70px; }
|
|
x3 { width: 70px; padding-left: 20px; padding-right: 20px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<x1><x2 style="height:50px;">
|
|
<x3><x4 style="height:20px; background:lime; "></x4></x3>
|
|
</x2></x1>
|
|
|
|
|
|
</body>
|
|
</html>
|