Material-ui: autoprefixer seems not to work with display: flex

[jony89]

Problem description

display: flex doesn't work on Android 4.3 .

an autoprefixes should be add.

Link to minimally-working code that reproduces the issue

link :

https://www.webpackbin.com/bins/-KffWrmKRQu-hBw5c88g

The "Hello world" element has CSS :

flex: 1 1 0%;

But this doesn't work on android 4.3 which doesn't accept flex.

You must run it on Android 4.3 emulator.

Versions

• Material-UI: 0.17.1
• React: 0.15.4
• Browser: android 4.3 & cordova

[oliviertassinari]

We should look at how it perform with the upcoming release. We have upgraded the prefixing library with #6343.

[jony89]

ok I'll retest when 0.17.2 will be out. any idea when it will be ?

[oliviertassinari]

Most likely this week-end.

[geohuz]

I am confused with usage of autoprefixer in material-ui, it seems that the master branch is using inline-style-prefixer and the @next branch is using jss-vendor-prefixer?

As in my project I'm heading to the @next branch and the requirement of cross browser support is needed, and I would like to make sure the proper way to enable the autoprefixer, especially the way of dynamic styling. From above conversation it seems we need to include styleManager in the project? What is the official way of doing this?

[oliviertassinari]

@geohuz That's a good question. The next branch is using the default jss preset, that comes with an auto-prefixer.
We use as few dynamic style as possible. If you depend on them, you can follow the same approach as the master branch by using inline-style-prefixer.

What is the official way of doing this?

We haven't documented it yet. But you can take a look at how it's done in the documentation

[jony89]

nothing on my end has changed with v0.17.3

I think it is urgent to take care of it as android v4.3 is pretty common and we cannot neglect it

[oliviertassinari]

That seems to be fine using the native browser of an Android 4.3 on the v1-beta branch: