flex布局时 固定宽度被压缩不展示

最近项目使用flex时遇到的坑

flex-shrink属性

1、flex-shrink属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。

.item {
  flex-shrink: <number>; /* default 1 */
}

2、如果所有项目的flex-shrink属性都为1，当空间不足时，都将等比例缩小。
3、如果一个项目的flex-shrink属性为0，其他项目都为1，则空间不足时，前者不缩小。
负值对该属性无效。

参考：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool