Implementing justify-self & align-self for abs-positioned elements, we ran into:
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:
- 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, top takes 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
Implementing
justify-self&align-selffor abs-positioned elements, we ran into:Which has something to the effect of:
align-self: stretchshould 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:<uno-navbar>'s shadow-root childopblock-summary-methodAs per the new absolute-positioning steps:
stretch's fallback alignment isstart, so take the first case - static position is attop: 0,bottomis just set to 0.stretch, auto size is stretch size.As per the old steps
auto, margins zeroed out,toptakes its static position value, which is zerobottom, taking up whatever empty space