問題描述

問題的演示地址：點擊這里

想實現的布局是按照2:1:1的寬度排列，但是現在在第三個項目中如果增加了比較多的內容，這個項目的寬度就會隨著內容的增加而增加，破壞了2:1:1的結構。

我在這里看到使用flex-basis:0的方式：

.column {margin: 10px;flex-grow: 1;flex-shrink: 1;flex-basis: 0; } .column:first-of-type {flex-grow: 2;flex-shrink: 2;flex-basis: 0; }

但是我這樣設置了并沒有產生效果，期望的效果是這樣的：

請問下該怎樣實現？

問題解答

shrink設為0

width:0;完美解決