2017-05-25 37 views
-1

我嘗試在Safari中使用柔性 - 但有問題的時候使用 柔性0 0 20%,在同一行與其他Flex容器 - Safari瀏覽器總是顯示我5元,但沒有包/如何在safari中使用flex?

<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="https://placehold.it/300" alt=""> 
     <img src="https://placehold.it/300" alt="">   
     <img src="https://placehold.it/300" alt="">   
     <img src="https://placehold.it/300" alt="">   
     <img src="https://placehold.it/300" alt="">   
     </div> 
    </div> 
</div> 

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

+0

https://stackoverflow.com/q/35137085/3597276 –

回答

0

這是safari中的一個錯誤,雖然它已經在舊版本的最新版本中修改爲更改。

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