Почему flex-wrap не работает в iOS Safari при использовании процентов?

Question

[Дмитрий Локшин]

Всем привет!

Имеется вот такой элементарный пример (для лучшего визуального восприятия убрал префиксы, но в исх. коде автопрефиксер все делает как надо). В Safari for iOS 9.0.1 перенос не работает, хотя должен работать.
Баг есть только при задании flex-элементам width в %. Flex-basis также не помогает, да и куча других решений, на которые убил уже кучу времени.
Нашел пример, где данный баг есть и на iPhone 6, и в качестве решения предлагается вообще отказаться от использования процентов в задании ширины элементов, что создает очень большие трудности (без процентов никак!).

Кто-нибудь сталкивался с подобной проблемой и есть ли обходные пути (не отказываясь от использования flexbox)?
Спасибо!

Comments

[Владислав Лысков]

с флекс-врап у меня тоже всегда -проблемы, там, где они есть использую флекс-дирешн, но прежде нкжно убедиться что все префиксы поставлены

[Дмитрий Локшин]

Владислав Лысков, А чем Вас помогает flex-direction при проблеме с flex-wrap?

[AlexandrBirukov]

так вроде

flex: 0 1 45%;
-webkit-flex: 0 1 45%;

[Пащук Илья]

Главное чтобы все префиксы проставлены были + само сокращение в старых браузерах может я flex разбей на отдельные свойства, также посмотри может в самом блоке родителя есть проблемы, поиграйся с width: inherit, width: max-content, width: fit-content; также я flex-flow тоже и мет смысл применять и может все заработает!
Если ты этом юзаешь какой то фрем, типа angular, то бывает из за главных родительских директив не срабатывает флексбокс в боаузерах сафари, тогда фиксить надо через js