-webkit-box comes after -webkit-flex

[websirnik]

Some vendor libraries, like Angular Material, come with the following css:

.class {
    display: -webkit-flex;
    display: flex;
}

This translates into:

.class {
    display: -webkit-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

That creates a problem for Safari 8, when -webkit-box comes after -webkit-flex(behaviour is very different, not a flexbox).

Would be great to have initial declaration to translate into

.class {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

... which is the current default for display: flex; in Autoprefixer.

[ai]

Autoprefixer main API is to add prefixes to unprefixed code. All other cases are low priority, so I can’t tell when I fix this issue.

[ai]

For youu case I can recommend to clean all prefixes in libraries by autoprefixer({ browsers: [] }) and then run Autoprefixer again with your browsers.

[websirnik]

I can live with this workaround :) Thanks!

[ai]

I just add this workaround to FAQ.

[ai]

Done dc0071c