CSS：百分比寬度與固定的最小寬度相結合會導致div不適合在一行中

Question

所以我遇到了這個問題：我一直在研究一個由3個div組成的網站的「響應性」（列 - 讓我們打電話他們'A'，'B'和'C'，全部96％高）+頁腳。 A和C屬於同一類，寬度爲35％。 B列寬度爲30％，但我也將其最小寬度設置爲200px。當我縮小瀏覽器以便B列寬度爲200px，並且無法獲得任何縮小並且不斷縮小時，C列就會跳下來。我試圖讓他們填充沒有固定的最小寬度和35％的最大寬度，而寫入最大寬度：35％;不足以實現這一目標。 有什麼建議嗎？ 在此先感謝！

Answer 1

HTML

<div class="container"> 
    <div class="col colA">A</div> 
    <div class="col colB">B</div> 
    <div class="col colC">C</div> 
</div> 

CSS

.container{ 
    display: flex; 
    justify-content: space-between; 
} 
.col{ 
    height: 96%; 
} 
.colA, .colC{ 
    background-color: blue; 
    flex-basis: 35%; 
} 
.colB{ 
    min-width: 200px; 
} 

小提琴：https://jsfiddle.net/4nhvtbpe/