问题描述

今天写项目的时候遇到一个老生常谈的问题，就是flex布局下的种种问题。父容器设置了flex，子容器设置了flex：1

出现场景

然后就出现了子容器刚好贴满的滚动不了的问题

解决方法

为了解决这个问题我果断的取消了使用flex布局，打算使用js来计算，但是想想，开销还是太大了，又用了回来，仔细想想这种问题碰到了好多次，都没去深究其中的原理，感觉自己好菜，所以决定研究一下并且记录一下,查阅资料得

原因：定义为flex布局元素的子元素，自动获得了flex-shrink的属性，这个属性是什么意思呢？就是告诉子元素当父元素宽度不够用时，自己调整自己所占的宽度比，这个flex-shrink设置为1时，表示所有子元素大家同时缩小来适应总宽度。当flex-shrink设置为0时，表示大家都不缩小适应。

总结

刚开始还有点不理解，宽度之和？高度就不算吗。
想啊想就明白了
flex-direction:column 的宽度不就是向下排列的吗

所以‘宽度没有任何问题，这里是一个小知识点’