Improve IE compatibility for flex-1 utility

[scottbedard]

IE has trouble understanding our flex-1 utility, perhaps we should avoid using the flex: 1 shorthand and be more explicit. After some digging, I wound up on this stackoverflow page and am now overwriting my flex-1 class with the following...

flex: 1 1 0;

FWIW, Edge seems to handle the existing utility just fine.

[iadcode]

This sounds like Flexbug #6.

Speaking of Flexbugs however, the above flex definition you're now using might cause Flexbug #4, which you could solve by using this:

flex: 1 1 0%;

There's also luisrudge/postcss-flexbugs-fixes which fixes both #4 and #6. You could just wack that into your PostCSS config after Tailwind.

[scottbedard]

Ah, thank you for the info, I always forget about that awesome repo. Would there be any downside to having our flex-1 utility written this way out of the box? It seems like a bit of a gotcha to use the shorthand, and then leaving it up to the user to apply this fix. If the maintainers oppose this change though, no worries, go ahead and close this issue.

[adamwathan]

Would totally accept a PR for this change 👍🏻

…

On Mon, Sep 10, 2018 at 12:56 PM Scott Bedard ***@***.***> wrote: Ah, thank you for the info, I always forget about that awesome repo. Would there be any downside to having our flex-1 utility written this way out of the box? It seems like a bit of a gotcha to use the shorthand, and then leaving it up to the user to apply this fix. If the maintainers oppose this change though, no worries, go ahead and close this issue. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#549 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AEH3bCJU-anwnONkBGc7bH3tcKShxqnQks5uZpmqgaJpZM4Wf-Ku> .