(forking from the 'Flex box help thread) Chris Rockwell <ch...@chrisrockwell.com> wrote :
> Have you seen http://css-tricks.com/snippets/css/a-guide-to-flexbox/? Be careful with that one. While in general it is quite good, it is not up to date with the spec anymore. One of the most important changes the recent iterations of the Flexbox spec has brought is the introduction of the `main-size` value for flex shorthand, and the re-introduction of the `auto` value —as the default— for min-width/min-height. http://www.w3.org/TR/css-flexbox-1/#min-size-auto But do read the whole thing: http://www.w3.org/TR/css-flexbox-1/ See also the changes: http://www.w3.org/TR/css-flexbox-1/#changes (and follow the links to the CSS-WG wiki and emails for all the discussions). At time of writing, Firefox Nightly builds [1] are the only ones that are spec compliant (and perhaps IE 12 developer builds, but I have no access to those). Consider this test case: http://dev.l-c-n.com/_temp/flexbox/flex-min-width.html In all current _release_ builds this displays identically (with the long-string in the right-hand column clipped). This is not how it _should work_ per the spec. If one opens the test case in a Firefox nightly build, the right-hand column will stretch to the width of the longest string. This test case has this fixed - it explicitly set `min-width: 0` for the affected flex-item. http://dev.l-c-n.com/_temp/flexbox/flex-min-width2.html [1] https://nightly.mozilla.org Philippe -- Philippe Wittenbergh http://l-c-n.com/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
