Неправильно обрабатывается flex-flow: row wrap; в сафари — как исправить?

Question

[kiberlain]

Есть сетка взятая вот отсюда gridlex.devlint.fr/index.html

и есть несколько блоков https://jsfiddle.net/46kc4ne1/ которые при заполнении должны переносится на следующую строку (в данном случае блоки располагаются по три в ряд). Все браузеры отрабатывают корректно кроме сафари, в сафари блоки заполняют один ряд без переноса.
Какой хак можно применить для устранения данной проблемы?

Answer 1

[Flyer3d]

Нужно поменять местами "display: -webkit-box; " и "display: -webkit-flex;" - и будет счастье! :)

Свежие сафари не отрабатывают -webkit-flex-flow в старом режиме display: -webkit-box;

Comments

[kiberlain]

народные хитрости на тостере :)

[sinneren]

А не сталкивались с таким, что в сафари flex-flow отрабатывает, но в 1 ряду (а иногда и во всех) последний элемент просто соскакивает на 2 ряд? Элементы со стилями ячеек бутстрапа 3.

[sinneren]

отмена, уже нашёлся вариант... margin: 0 -1px для всех col

Answer 2

[imdeveloper]

Прогнать css файл через GULP и будет вам счастье

Comments

[kiberlain]

вы имеете в виду что если gulp все необходимы префиксы расставит то всё будет хорошо?
увы автопрефиксер в данном случае бессилен =/