As per https://drafts.csswg.org/css-position/#original-cb they should happen later. In general, multiple of these adjustments should be rarer and browsers aren't particularly consistent. It's also unclear to me how it affects the scrollable containing block stuff, I filed bug 2004596 to sort that out. Give a reasonable CB (the grid container's padding rect) down from grid layout now that we might not use the actual grid CB. Remove a check for fallbacks that isn't needed since part 1 of bug 1991929. Differential Revision: https://phabricator.services.mozilla.com/D275368
52 lines
981 B
HTML
52 lines
981 B
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1924786">
|
|
<link rel="help" href="https://drafts.csswg.org/css-position/#original-cb">
|
|
<link rel="match" href="grid-position-area-basic-ref.html">
|
|
<style>
|
|
#grid {
|
|
display: grid;
|
|
grid: 150px 100px / 200px 300px;
|
|
padding: 20px;
|
|
position: relative;
|
|
border: 1px solid;
|
|
}
|
|
|
|
#positioned {
|
|
position: absolute;
|
|
background: magenta;
|
|
grid-column: 1 / 2;
|
|
grid-row: 1 / 2;
|
|
position-anchor: --foo;
|
|
position-area: top right;
|
|
/* FIXME: Shouldn't be needed */
|
|
width: fit-content;
|
|
height: fit-content;
|
|
}
|
|
|
|
#static {
|
|
background: pink;
|
|
grid-column: 1 / 2;
|
|
grid-row: 1 / 2;
|
|
}
|
|
|
|
#anchor {
|
|
background: lime;
|
|
grid-column: 2 / 3;
|
|
grid-row: 2 / 3;
|
|
anchor-name: --foo;
|
|
}
|
|
|
|
.abs-cb {
|
|
width: 600px;
|
|
height: 600px;
|
|
position: relative;
|
|
}
|
|
</style>
|
|
|
|
<div id="grid">
|
|
<div id="anchor"></div>
|
|
<div id="positioned">Anchored</div>
|
|
<div id="static"></div>
|
|
</div>
|