Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-images] Avoid 0/0 division in stripes() #9666

Open
Loirooriol opened this issue Dec 1, 2023 · 3 comments
Open

[css-images] Avoid 0/0 division in stripes() #9666

Loirooriol opened this issue Dec 1, 2023 · 3 comments

Comments

@Loirooriol
Copy link
Contributor

https://drafts.csswg.org/css-images-4/#stripes

A <flex> is evaluated as a fraction of the total width relative to the total sum of <flex> entries in the function, after subtracting the thickness of any non-<flex> entries (flooring the subtraction result at zero). If the sum of <flex> values is less than 1fr, the result of the subtraction is multiplied by the sum’s value before being distributed.

If all the <flex> values are 0fr, then the fractions will be 0/0.

Since the amount being distributed is multiplied by 0, then it seems fine to just not distribute anything.

@SebastianZ
Copy link
Contributor

That's actually covered by the last sentence. So, in case of the sum being 0fr there is no division, only a multiplication (by 0). And as the <flex> values are all 0fr, there is no distribution happening.

Having said that, I guess we can just remove that definition and instead rely on the definition of <flex> once it got generalized and moved to CSS Values.

That has a more detailed definition for sums less than one distributing the leftover space according to the requested portions.

Sebastian

@Loirooriol
Copy link
Contributor Author

Let's say the total width is 100px, and there are two stripes, 0fr 0fr.
We take the 100px, no need to subtract anything, and then multiply by 0. So we are distributing 0px.
But we still need to do the actual distribution among the stripes. How much does each stripe get? It's "a fraction [...] relative to the total sum of <flex> entries in the function", so 0 / (0 + 0) * 0px each one.
That has a 0/0 division.

@SebastianZ
Copy link
Contributor

The logic behind that is meant to be the same everywhere where <flex> values can be used.

From the general definition:

<flex> values between 0fr and 1fr have a somewhat special behavior: when the sum of the flex factors is less than 1, they will take up less than 100% of the leftover space.

However, if the tracks request less than the full amount (such as three tracks that are each .25fr) then they’ll each get exactly what they request (25% of the leftover space to each, with the final 25% left unfilled).

This pattern is required for continuous behavior as fr values approach zero (which means the tracks wants none of the leftover space).

So 0fr won't take up any leftover space.

Though the definition you quoted above came from @tabatkins. So maybe he can decide whether to remove it or adjust it to align it with the general definition.

Sebastian

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants