RE: [css3-flexbox] negative flexibility

I added this as an issue to the spec.

> -----Original Message-----
> From: Alex Mogilevsky [mailto:alexmog@microsoft.com]
> Sent: Monday, May 07, 2012 7:36 PM
> To: www-style@w3.org
> Subject: [css3-flexbox] negative flexibility
> 
> A "division" formula that I proposed for negative flexibility earlier [1]
> was incorrect, it would not get a continuous scaling.
> 
> Correct formula for the desired result:
> 
> 	space-shortage = sum(flex-basis) - available-space
> 	shrink-factor = space-shortage / sum(flex-basis * negative-flex))
> 	main-size = flex-basis * (1 - shrink-factor * negative-flex))
> 
> With this, bigger items shrink faster and items of same flex keep same
> relative size when shrinking.
> 
> Example 1:
> 
> <div id="Flexbox" style="display:flex">
> 	<div id="A" style="flex:1 1 100px"></div>
> 	<div id="B" style="flex:1 1 500px"></div> </div>
> 
> Linear shrinking:
> 
>     Flexbox     A       B
>     600         100     500
>     500         50      450
>     400         0       400
>     300         0       300
>     200         0       200
>     100         0       100
> 
> Proportional shrinking:
> 
>     Flexbox     A       B
>     600         100     500
>     500         83      417
>     400         67      333
>     300         50      250
>     200         33      167
>     100         17      83
> 
> I think "proportional" is a much better behavior.
> 
> Note that the most useful behavior is when 'flex-shrink' is same on all
> flexible items. Considering that 'flex-grow' is rarely anything other than
> 0 or 1 and that with this formula equal flexibility works well for
> shrinking,
> 
> 	* "flex:auto" should be same as "flex:1 1 auto" (instead of "1 0
> auto")
> 	* "flex:N" should be same as "flex:N N 0px" (instead of "N 0 0px")
> 
> [1] http://lists.w3.org/Archives/Public/www-style/2012Apr/0692.html
> 
> Alex
> 
> 
> 
>

Received on Tuesday, 8 May 2012 09:12:33 UTC