[css-position-3] Absolute positioning - Is the new inset & auto-size behaviour web-compatible? #11195
Description
Implementing justify-self & align-self for abs-positioned elements, we ran into:
- https://bugzilla.mozilla.org/show_bug.cgi?id=1930427
- https://bugzilla.mozilla.org/show_bug.cgi?id=1930850
Which has something to the effect of:
<!DOCTYPE html>
<style>
.abs {
position: absolute;
align-self: stretch;
height: auto;
top: auto;
bottom: auto;
background: lime;
}
</style>
<div class="abs">Test</div>
align-self: stretch should be a no-op (At least for absolute elements not within flex/grid context) in the old behaviour, but seems to be used by websites in the wild anyway in the linked bugs:
- Virustotal:
<uno-navbar>'s shadow-root child - SAP:
opblock-summary-method
As per the new absolute-positioning steps:
- Calculate inset-modified containing block:
- Inset resolution:
stretch's fallback alignment isstart, so take the first case - static position is attop: 0,bottomis just set to 0.
- Inset resolution:
- Resolving sizes: Definite available size is viewport, no min/max height is given, and since self-alignment is
stretch, auto size is stretch size. - Auto margins: N/A
- Alignment: Fits exactly in the available space
As per the old steps
- Everything is
auto, margins zeroed out,toptakes its static position value, which is zero - Height is Auto heights for block formatting context roots - Distance between top of the topmost line box and bottom of the bottommost line box, so auto size is basically a shrink-fit size.
- Solve for
bottom, taking up whatever empty space