ako používať flex v safari? - css, safari, flexbox

Snažím sa používať flex v safari - ale majú problém pri použití flex 0 0 20% v rovnakom rade s iným flex kontajnerom - safari vždy ukazuje 5 prvkov, ale nie zábal /

<style>
html {
width: 800px;
}
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.brand {
display: flex;
width: 100%;
}
.brand-info {
flex: 1;
}
.brand-list {
flex:2;
max-width: 100%;
}
.brand-list-items {
display: flex;
flex-wrap: wrap;
max-width: 100%;
}

.brand-list-items img {
flex: 0 0 20%;
}

</style>

<div class="brand">
<div class="brand-info">
base info
</div>
<div class="brand-list">
<div class="brand-list-items">
<img src="/images/https://placehold.it/300" alt="">
<img src="/images/https://placehold.it/300" alt="">
<img src="/images/https://placehold.it/300" alt="">
<img src="/images/https://placehold.it/300" alt="">
<img src="/images/https://placehold.it/300" alt="">
</div>
</div>
</div>

https://jsfiddle.net/betasap/r3hm86zq/

odpovede:

Toto je chyba v safari, hoci bola opravená v najnovšej verzii pre staršie verzie.

.brand-list-items img { flex: 0 0 10em; }