Skip to content

Commit ea056f7

Browse files
mstenshochromium-wpt-export-bot
mstensho
authored and
chromium-wpt-export-bot
committed
Lay out OOFs in tree order.
Out-of-flow positioned elements bubble up during in-flow layout. Then we lay out that list of OOFs when at their containing block. Each such OOF `child` may have OOF descendants on its own, and they are not necessarily contained by `child` (if they are fixed-positioned, typically), and they may therefore bubble up to the containing block we're currently processing (and even beyond), instead of being dealt with inside of `child`. We used to take care of such "new" OOFs when done with the initial list, but that may violate tree order. Instead, handle them right after `child` (their ancestor) has been laid out. Do this recursively, since there may be nesting (e.g. fixed in fixed in OOF). Correct tree order is important for anchor-positioned elements, so that the anchors that they refer to are correctly discovered. Bug: 428354426 Change-Id: Ibe27b6064599350905296bda1e29d1def1217d93 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6905362 Commit-Queue: Morten Stenshorne <[email protected]> Reviewed-by: Koji Ishii <[email protected]> Cr-Commit-Position: refs/heads/main@{#1509471}
1 parent 1dd9ba8 commit ea056f7

File tree

2 files changed

+44
-0
lines changed

2 files changed

+44
-0
lines changed

‎css/css-anchor-position/anchor-name-006.html‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<title>An anchor in nested fixedpos should be acceptable for an anchor-positioned element on the outside</title>
3+
<link rel="author" title="Morten Stenshorne" href="mailto:[email protected]">
4+
<link rel="help" href="https://issues.chromium.org/issues/428354426">
5+
<style>
6+
#overlay {
7+
position: fixed;
8+
position-anchor: --a;
9+
width: anchor-size(width);
10+
height: anchor-size(height);
11+
background: green;
12+
}
13+
</style>
14+
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
15+
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
16+
<div style="position:fixed;">
17+
<div style="position:fixed;">
18+
<div style="anchor-name:--a; width:100px; height:100px; background:red;"></div>
19+
</div>
20+
</div>
21+
<div id="overlay"></div>

‎css/css-anchor-position/anchor-name-007.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!DOCTYPE html>
2+
<title>An anchor inside three fixedpos containers should be acceptable for an anchor-positioned element on the outside</title>
3+
<link rel="author" title="Morten Stenshorne" href="mailto:[email protected]">
4+
<link rel="help" href="https://issues.chromium.org/issues/428354426">
5+
<style>
6+
#overlay {
7+
position: fixed;
8+
position-anchor: --a;
9+
width: anchor-size(width);
10+
height: anchor-size(height);
11+
background: green;
12+
}
13+
</style>
14+
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
15+
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
16+
<div style="position:fixed;">
17+
<div style="position:fixed;">
18+
<div style="position:fixed;">
19+
<div style="anchor-name:--a; width:100px; height:100px; background:red;"></div>
20+
</div>
21+
</div>
22+
</div>
23+
<div id="overlay"></div>

0 commit comments

Comments
 (0)