W3C home > Mailing lists > Public > www-style@w3.org > December 2014

Re: [css-flexbox] flex-shrink being handled differently in different browsers

From: Philip Walton <philip@philipwalton.com>
Date: Tue, 16 Dec 2014 11:31:44 -0800
Message-ID: <CAGRhNhXO+1GkqVFHTf9p-fAyf8FymmbcFyUMaxzVhbbOMk=R+w@mail.gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: www-style list <www-style@w3.org>
Ahh, that makes perfect sense. Thanks!

On Tue, Dec 16, 2014 at 11:17 AM, Tab Atkins Jr. <jackalmage@gmail.com>
wrote:
>
> On Tue, Dec 16, 2014 at 10:14 AM, Philip Walton <philip@philipwalton.com>
> wrote:
> > According to the editors draft of the flexbox spec, the initial
> > `flex-shrink` value for flexbox items is 1 and the initial value for
> > `flex-basis` is `auto`.
> >
> > I've linked to a jsbin where there is too much content to fit into a
> > containing box, and the way the shrinking is happening in Chrome/IE12 is
> > different from FF/Safari.
> >
> > http://jsbin.com/xetinivozo/1
> >
> > Since the initial `flex-shrink` value is 1, it seems perhaps Chrome and
> IE
> > are correct, but it's unclear how they've chosen the amount they're
> > shrinking.
> >
> > Can anyone speak to which behavior is correct and why?
>
> Haven't tested IE, but Chrome's behavior is incorrect, and it's
> because they haven't yet matched the spec regarding the implied
> minimum size of flex items
> <http://dev.w3.org/csswg/css-flexbox/#min-size-auto>.  Since they're
> not honoring that, the height is allowed to shrink to zero, leaving
> only the padding, and then the text overflows downwards.
>
> The correct behavior, since overflow is "hidden" (the default value)
> on the header and footer, is to treat them as "min-height:
> min-content;", and not shrink at all, like Firefox does.
>
> ~TJ
>
Received on Tuesday, 16 December 2014 19:32:11 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:49 UTC