Flexbox не работает в сафари (префикс)

Question

По какой-то причине мой flexbox не работает в Safari.

Он также не работает для меня в Chrome на iOS, однако Chrome на моем Mac или на устройствах Android работает нормально. Ниже мой код.

div.row { 
padding: 0; 
display: -webkit-box; 
display: -ms-flexbox; 
display: -webkit-flex; 
display: flex; 
flex-wrap: wrap; 
-webkit-flex-wrap: wrap; 
-ms-flex-wrap: wrap; 
-webkit-box-pack: center; 
-ms-flex-pack: center; 
justify-content: center; 
-webkit-justify-content: center; 
-ms-justify-content: center; 
} 
div.inner { 
-webkit-box-flex: 1; 
-webkit-flex: 1; 
-ms-flex: 1; 
flex: 1; 
text-align: center; 
padding: 0 10px; 
padding-top: 50px; 
min-width: 200px; 
} 

Я сделал JSFiddle http://jsfiddle.net/mynv6k4q/ показать.

Когда окно просмотра становится меньше, блок на дне должен растягиваться, а два блока сверху должны быть рядом друг с другом, пока они не получат ширину менее 200 пикселей. Это отлично работает в Chrome, но Safari не будет работать, даже если он имеет префикс.

Что может быть неправильным?

Answer 1

Это было исправлено путем изменения «flex: 1» на «flex: 1 0 200px». По-видимому, минимальная ширина не работает в сочетании с Flexbox в Safari.