工作中遇到一些flex-grow:1的容器失效,一堆文字乱码溢出,最后看了一下flex布局的原理解决了

#div{
  flex-grow:1;
  wisth: 0;
}

如果遇到另一边的div设了宽但是被flex-grow:1的内容挤压了,可以给设了宽的div加 flex-shrink: 0; 这个属性,就能解决了

.item-right{
  width: 100px;height: 100px;
  flex-shrink: 0;
}