问题
flex布局中,右边容器固定宽度,左边容器自适应宽度,左边容器中的内容需要做溢出展示滚动条,当左边缩小到一定程度时,就不会再缩小了,无法出现滚动条。
就像这个链接中的内容一样:codepen.io/catmiao8/pe…
解决方案
在左边自适应的容器上加上:min-width: 0
解决后的亚子:codepen.io/catmiao8/pe…
原因
默认情况下,弹性项目不会缩小到其最小内容大小以下。也就是说项目的最小宽度是其内容的宽度,并且不会缩小超过该宽度。当需要做溢出处理时,需要设置min-width: 0,这样才能正确的调整比例大小