@@ -2910,10 +2910,12 @@ Flex Container Intrinsic Main Sizes</h4>
2910
2910
For each <a>flex item</a> ,
2911
2911
subtract its outer <a>flex base size</a> from its [[#intrinsic-item-contributions|max-content contribution]] size.
2912
2912
If that result is positive,
2913
- divide by its <a>flex grow factor</a>
2914
- (if dividing by zero, treat the result as infinity);
2915
- if negative,
2916
- divide by its <a>scaled flex shrink factor</a>
2913
+ divide it by the item's <a>flex grow factor</a>
2914
+ if the <a>flex grow factor</a> is ≥ 1,
2915
+ or multiply it by the <a>flex grow factor</a>
2916
+ if the <a>flex grow factor</a> is < 1;
2917
+ if the result is negative,
2918
+ divide it by the item's <a>scaled flex shrink factor</a>
2917
2919
(if dividing by zero, treat the result as negative infinity).
2918
2920
This is the item's <var> desired flex fraction</var> .
2919
2921
@@ -2926,9 +2928,13 @@ Flex Container Intrinsic Main Sizes</h4>
2926
2928
This is the line’s <var> chosen flex fraction</var> .
2927
2929
2928
2930
<li>
2929
- If the sum of the line’s <a>flex grow factors</a>
2930
- (<a>flex shrink factors</a> ,
2931
- if the <var> chosen flex fraction</var> is negative)
2931
+ If the <var> chosen flex fraction</var> is positive,
2932
+ and the sum of the line’s <a>flex grow factors</a>
2933
+ is less than 1,
2934
+ divide the <var> chosen flex fraction</var> by that sum.
2935
+
2936
+ If the <var> chosen flex fraction</var> is negative,
2937
+ and the sum of the line’s <a>flex shrink factors</a>
2932
2938
is less than 1,
2933
2939
multiply the <var> chosen flex fraction</var> by that sum.
2934
2940
@@ -2984,14 +2990,60 @@ Flex Container Intrinsic Main Sizes</h4>
2984
2990
but when the item is ''flex-grow: 1'' or higher, the <a>flex container</a> (and flex item) is ''200px'' wide.
2985
2991
2986
2992
There are several possible ways to make the overall behavior continuous between these two cases,
2987
- particularly when the sum of flexibilities on a line is between 0 and 1,
2988
2993
but all of them have drawbacks.
2989
2994
We chose one we feel has the least bad implications;
2990
- unfortunately, it "double-applies" the flexibility when the sum of the flexibilities is less than 1.
2995
+ unfortunately, it "double-applies" the flexibility in cases with [=flex factors=] that are < 1.
2991
2996
In the above example, if the item has ''flex-grow: .5'' ,
2992
2997
then the <a>flex container</a> ends up ''150px'' wide,
2993
2998
but the item then sizes normally into that available space,
2994
2999
ending up ''125px'' wide.
3000
+
3001
+ <details class=note>
3002
+ <summary> Even more involved notes on the specific behavior chosen</summary>
3003
+
3004
+ Principles:
3005
+
3006
+ 1. Don't explode any sizes, whether growing or shrinking, as inputs approach zero.
3007
+ 2. When flex factors are all >=1, return the minimum size necessary for every item to be >= max-content size.
3008
+ 3. Items with a zero flex shouldn't affect the sizes at all.
3009
+ 4. Keep it continuous over variance of flex factors and item sizes.
3010
+ 5. Keep sizing variance as linear as possible with respect to linear changes to any input variable (size, flex factor).
3011
+ 6. When the sum of flex factors is >=1, return the minimum size necessary for every item to be >= max-content size.
3012
+
3013
+ To get these all to work together,
3014
+ we have to apply some correction when either flex factors
3015
+ or the sum of flex factors on a line
3016
+ is < 1.
3017
+
3018
+ For shrink our behavior is somewhat easier;
3019
+ since the explosive case of 0 shrink
3020
+ results in a negative infinity desired fraction
3021
+ which we'll never choose (since we always take the largest),
3022
+ we can just apply the correction at the line level,
3023
+ giving us double-application only when the sum is < 1.
3024
+
3025
+ For positives it's more complicated.
3026
+ 0 grow naively explodes into *positive* infinity,
3027
+ which we'd choose,
3028
+ so we need to apply the correction at the individual item level.
3029
+ We do that by multiplying the space by the factor when factor is <1.
3030
+ Leaving it at that would result in a double-application for items < 1
3031
+ but sum >= 1,
3032
+ but a *triple*-application when the sum is < 1.
3033
+ To avoid *that* ridiculousness,
3034
+ we apply a *reverse* correction when the sum is 1,
3035
+ dividing by the sum instead.
3036
+ This leaves us with a double correction in all cases for items with factors < 1.
3037
+
3038
+ We can't eliminate the double-applications entirely
3039
+ without giving up other, more important principles
3040
+ (in particular, principle 3 --
3041
+ try to come up with rules that don't double-apply
3042
+ when you have two items with ''flex-grow: .5'' ,
3043
+ but also don't give a ''flex-grow: 0'' item any power
3044
+ over a ''flex-grow: 1'' sibling;
3045
+ you can't, as far as we can tell.)
3046
+ </details>
2995
3047
</details>
2996
3048
2997
3049
<h4 id='intrinsic-cross-sizes'>
0 commit comments