Здравствуйте.
Есть несколько рядов карточек (по 3 карточки в каждом ряду) и в зависимости от размера окна браузера ряды сужаются с помощью
flex-wrap: wrap и
min-width, а карточек в ряду становится 2 или 1. Однако
flex-wrap: wrap отказывается работать на iOS-устройствах (в частности, на iPad вне зависимости от браузера) и в результате получаются все карточки в одну колонку вместо целых рядов по 2 карточки.
Когда же использую
flex-wrap: nowrap то всё отображается надлежащим образом (то есть flexbox работает, но этот способ мне не подходит).
Уже прописал казалось-бы все префиксы, но результат по-прежнему неудовлетворительный. Как решить проблему?
Пример для наглядности на
JSfiddle.
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
flex-flow: row wrap;
justify-content: space-between;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
