Closed
Description
https://drafts.csswg.org/css-align/#justify-abspos, https://drafts.csswg.org/css-align/#align-abspos
For all other absolutely-positioned boxes, normal behaves as stretch.
That's not the case in Blink, normal
behaves as start
for abspos tables, and that makes sense to me.
<!DOCTYPE html>
<style>
div { display: inline-block; position: relative; border: solid; width: 100px; height: 100px; }
table { position: absolute; inset: 0; background: cyan; }
</style>
<div><table style="place-self: normal"><td>table</td></table></div>
<div><table style="place-self: stretch"><td>table</td></table></div>
There are tests for Blink's behavior:
- https://wpt.fyi/results/css/css-align/abspos/table-justify-self-stretch.html
- https://wpt.fyi/results/css/css-align/abspos/table-align-self-stretch.html
This is consistent with the interoperable flexbox behavior
<!DOCTYPE html>
<style>
div { display: inline-flex; border: solid; width: 100px; height: 100px; }
table { background: cyan; }
</style>
<div><table style="align-self: normal"><td>table</td></table></div>
<div><table style="align-self: stretch"><td>table</td></table></div>
Blink also uses justify-self: normal
to explain the table shrink-to-fit size in block layout
<!DOCTYPE html>
<style>
div { display: inline-block; border: solid; width: 100px; height: 100px; }
table { background: cyan; }
</style>
<div><table style="justify-self: normal"><td>table</td></table></div>
<div><table style="justify-self: stretch"><td>table</td></table></div>