Re: [css-flexbox] webkit not wrapping with flex-wrap: 0;

On Tue, Nov 11, 2014 at 5:08 PM, Bruno Racineux <bruno@hexanet.net> wrote:
> On 11/11/14 4:23 PM, "Tab Atkins Jr." <jackalmage@gmail.com> wrote:
>>
>>To resummarize:
>
> Thanks. That re-clarifies the conflicts, though
> my use case strictly involves flex: 1 1 0px;

Huh?  This is from a totally different thread. ^_^

>>If you set the flex-basis to "0" (and also set the min-width to "0",
>>which may be buggy in WebKit/Blink), then that's the size of the item
>>at the time that wrapping occurs - 0px.  You can fit an infinite
>>number of 0px items on a single line, so no wrapping occurs.  The
>>property is definitely being honored, it just doesn't do anything in
>>this case.
>>
>>(If I'm not addressing your issue, please gimme some example code to look
>>at.)
>
> This is the reported example that behaves differently in Webkit/Safari and
> others browser: http://jsfiddle.net/3zd7yspg/1/
>
> IE, FF and Chrome's current version do wrap, but Safari 7.1-8 does not,
> and older prefixed Chrome versions did not either.
> See browserstack.com/screenshots/8c76e7bd5c0c8eae83aa9d09a8f7a32b67309c43
>
> My assumption is the flex: 1 1 redistributing free space should make it
> wrap despite flex basis of 0px. Should that example wrap or not?

This example should wrap, *because there's a min-width:3em*.  (And in
general, if there's *not* a min-width, the default specced behavior of
min-width:auto should cover this case and make them wrap as well, but
browsers don't all follow the spec here yet.  In this particular case,
the min-width:auto behavior will still let them get small enough to
avoid wrapping.)

Anything which doesn't wrap this example is definitely buggy.

~TJ

Received on Wednesday, 12 November 2014 01:31:59 UTC