Re: [csswg-drafts] [css-flexbox-1] Inconsistent sizing of replaced elements in flex containers (#12012)

>The flex item containing text is sized as max-content, trying to fit all the text in a single line. But of course it's not possible for the single-line text plus the 50% wide image to fit in the container, so both items shrink.

I agree. What confused me was [9.7(3)](https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths), which says:

> “Any item that has a flex factor of zero”

What exactly does that mean? Both items have by default have flex factor of 0 (flex-grow), yet they aren’t frozen.  

Additionally, the algorithm distinguishes between two situations:

> *If the sum is less than the flex container’s inner main size, use the flex grow factor for the rest of this algorithm; otherwise, use the flex shrink factor.*

But step 3 gives three freezing conditions:

- Any item that has a flex factor of zero  
- If using the flex grow factor: any item with a flex base size greater than its hypothetical main size  
- If using the flex shrink factor: any item with a flex base size smaller than its hypothetical main size

I understand why the last two conditions don’t apply —but what’s the purpose of the first one—“any item that has a flex factor of zero”?

And finally, even if everything is working as spec’d—why doesn’t Firefox reduce the image proportionally, stopping at its intrinsic width, like Chrome does? This feels like a basic behavior that layout engines ought to agree on.

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


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

Received on Thursday, 27 March 2025 18:15:02 UTC