From 1c476ba52ff57f9efaa91c205522796324a96514 Mon Sep 17 00:00:00 2001 From: Tab Atkins-Bittner Date: Fri, 2 Feb 2024 13:52:31 -0800 Subject: [PATCH] [css-sizing-4] Define stretch sizing properly, rather than (incorrectly) indirecting thru stretch alignment. --- css-sizing-4/Overview.bs | 45 ++++++++++++++-------------------------- 1 file changed, 16 insertions(+), 29 deletions(-) diff --git a/css-sizing-4/Overview.bs b/css-sizing-4/Overview.bs index b43a2e265ff..74a8ebeee81 100644 --- a/css-sizing-4/Overview.bs +++ b/css-sizing-4/Overview.bs @@ -826,37 +826,24 @@ Extrinsic Size Determination

Stretch-fit Sizing: filling the containing block

- Stretch-fit sizing tries to set the box’s used size - to the length necessary - to make its outer size as close to filling the [=containing block=] as possible - while still respecting the constraints imposed by min-height/min-width/max-height/max-width. - - Formally, its behavior is the same as specifying an [=automatic size=] - together with a [=self-alignment property=] value of ''width/stretch'' - (in the relevant axis), - except that the resulting box, - which can end up not exactly fitting its [=alignment container=], - can be subsequently aligned by its actual [=self-alignment property=] value. - - Additionally, - in [=formatting contexts=] and axes in which the relevant [=self-alignment property=] does not apply - (such as the block axis in Block Layout, or the main axis in Flex Layout), - in cases where a percentage size in that axis would resolve to a definite value, - a [=stretch-fit size=] - causes the box to attempt to fill its containing block-- - behaving as ''100%'' - but applying the resulting size to its margin box - instead of the box indicated by 'box-sizing'. + [=Stretch-fit sizing=] indicates the size necessary to make the box’s [=outer size=] + fill the [=containing block=]. + For [=absolutely positioned boxes=], + it fills the [=inset-modified containing block=]. + Similar to <> sizes, + when the [=containing block=] size in the relevant axis is not [=definite=], + the [=stretch-fit size=] resolves to the [=automatic size=]. + For this purpose, ''margin/auto'' margins are treated as zero, - and furthermore, for [=block-level boxes=] in particular, - if its block-start/block-end [=margin=] - would be adjoining to its parent's block-start/block-end [=margin=] + and furthermore, for a [=block-level box=] in particular, + if its [=block-start=] ([=block-end=]) [=margin=] + would be [=adjoining=] + to its parent's [=block-start=] ([=block-end=]) [=margin=] if its parent’s [=sizing properties=] all had their [=initial values=], - then its block-start/block-end [=margin=] is treated as zero. - - Note: Consequently, if neither ''align-self/stretch'' alignment applies - nor percentage sizing can resolve, - then the box will resolve to its [=automatic size=]. + then its [=block-start=] ([=block-end=]) [=margin=] is treated as zero. + (I.e. the margins are treated as if they collapsed away, + so that a child whose margins collapse with its parent + will correctly and completely fill its parent.)
For example, given the following HTML representing two [=block boxes=]: