Re: [csswg-drafts] [css-backgrounds-4][css-grid] Allow transitions between different types within `stripes()` (#8622)

Flex isn't interpolable with length in Grid because they cause trigger different layout behaviors, and figuring out a way to mix their effects with continuity would have been way too complicated for the benefit we'd get from it.

In stripes() flexes are much simpler (they just turn into lengths with a relatively trivial transform), so in theory they could be interpolable. You can't do it naively with a calc(), tho.  Flex values are context-dependent, not just on the container size but also on the sum of all flex values in use in the context. A `10fr` is large if it's accompanied by a `1fr`, but small if accompanied by a `100fr`. This means you have two general problems:

1. If the sums of flexes are different between the starting and ending values, the intermediate values will *not* reproduce what you'd naively expect if you just resolved the flexes to lengths and interpolated them.

2. 0fr has a fundamentally different behavior from any >0fr value.

We could fix both of these! For (1) we could normalize the flex sum to a fixed value (1fr?) at computed-value time. (This is probably a good idea anyway, since the currently-allowed interpolation of flex segments still suffers from this problem - `1fr, 4fr` to `400fr, 100fr` does *not* produce equal-sized stripes in the middle.) For (2) we could reproduce the behavior from flexbox where if the flex sum is <1, it represents only the corresponding portion of the free space, so `.1fr, .2fr` would only fill 30% of the space while `1fr, 2fr` fills the whole thing. (We already have the "pretend there's a transparent 1fr stripe at the end, if they're all fixed" behavior; it can expand to activate whenever the sum is <1, taking the remainder to raise the sum to 1.)

These two fixes would give us a reasonable interpolation behavior, but we'd still have to deal with the mixing of flex/length issue, and define what happened in Grid if you mixed them. (Right now it's a syntax error, so we don't have to deal with it.)

-- 
GitHub Notification of comment by tabatkins
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8622#issuecomment-1483386351 using your GitHub account


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

Received on Friday, 24 March 2023 20:45:08 UTC