[csswg-drafts] [css-sizing-4] Consider adding `stretch(weight)` size (#8267)

nicoburns has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-sizing-4] Consider adding `stretch(weight)` size ==
#### Relevant sections of the specification:
https://www.w3.org/TR/css-sizing-4/#sizing-values
https://www.w3.org/TR/css-sizing-4/#stretch-fit-sizing

#### Context

- CSS sizing level 4 adds the `stretch` keyword as a size that can be used to make children stretch to take up remaining available space in their parent. This is an extremely useful capability, but it would be even more useful if you could control the proportion in which multiple stretched sizes take up space (e.g. the widths of two children in the same Flexbox row).
- [Subform Layout](https://subformapp.com/articles/why-not-flexbox/) also implements stretch-like layout, including the proposed extension below, and this proposal is partially motivated by trying to integrate a [library](https://github.com/vizia/morphorm) implementing subform layout into a [layout engine](https://github.com/DioxusLabs/taffy) that currently only support CSS layout modes (Flexbox and Grid).

#### Proposal

- Add a `stretch(weight)` function where the weight parameter is a  `<number>`. This parameter would control the proportion of available space that is taken up by each stretched size in much the same way that `flex-grow` and `fr` units do.
- The plain `stretch` keyword would be equivalent to `stretch(1)`
-  This would affect cases where there can be multiple elements in an axis with a stretch size that should share the available space such as is the case for stretch sizes in the main axis of a Flexbox container. In cases where stretch behaves like auto the weight would have no effect.

I believe this would be trivial to implement for user agents already implementing the regular `stretch` keyword.

---

P.S. This is my first time attempting to contribute to a CSS standard. Please let me know if this is not the appropriate place to make suggestions like this. If that is the case, I'd greatly appreciate being directed to a more suitable venue.




Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8267 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 30 December 2022 01:47:54 UTC