Summary: | [CSS Grid Layout] Layout is wrong for flex factor sum between 0 and 1 | ||||||||
---|---|---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | Javier Fernandez <jfernandez> | ||||||
Component: | Layout and Rendering | Assignee: | Javier Fernandez <jfernandez> | ||||||
Status: | RESOLVED FIXED | ||||||||
Severity: | Normal | CC: | commit-queue, darin, esprehn+autocc, glenn, hyatt, jfernandez, kondapallykalyan, rego, svillar | ||||||
Priority: | P2 | Keywords: | BlinkMergeCandidate | ||||||
Version: | WebKit Nightly Build | ||||||||
Hardware: | Unspecified | ||||||||
OS: | Unspecified | ||||||||
Attachments: |
|
Description
Javier Fernandez
2015-08-31 13:52:32 PDT
In particular, the correct result is achieved by <https://drafts.csswg.org/css-grid/#algo-find-fr-size>, step 2, second sentence. If you don't do this, you'll normalize sums less than 1. This is necessary to do for the same reason as it is in Flexbox - to make transitions/animations work correctly and smoothly to/from 0. You need to actually step through that algorithm and see what that step does. "Set it to 1 instead" has a very specific effect that's not intuitive if you haven't seen it before - it ensures that we *don't* normalize the individual tracks to fill the space. More precisely, when we sum up the flexes, that tells us how many "units" of flex need to fit into the free space. We then figure out what size to assign to the flex unit based on that, and send that back to the individual items, sizing them appropriately to their flex value. If you *naively* use the sum in all cases, then in a case like ".1fr .2fr .3fr", you tell the algorithm "I've got .6 units of flex to fit into that space. Tell me how big 1fr should be to make that happen", and the algorithm spits out a size that makes all the columns fill the space. If you do step 2 *correctly*, you lie and say "I've got 1 unit of flex to fit into that space". Then when you get the size of a flex unit, the columns are sized accordingly, and only fill 60% of the space. This is the correct behavior. For example, it lets you animate from 1fr to 0fr correctly. The naive behavior would make the track fill the entire space all the way from 1 to 0+ε, then we'd need a special case to handle 0 flex to avoid a division by 0. The specced behavior instead makes it shrink to zero smoothly, and handles the zero case automatically. Created attachment 260359 [details]
Patch
Comment on attachment 260359 [details] Patch Clearing flags on attachment: 260359 Committed r189208: <http://trac.webkit.org/changeset/189208> All reviewed patches have been landed. Closing bug. |