Html IE11 flex child不'；不要缩小尺寸，给其他有非包装内容的孩子留出空间

当另一个孩子太小而无法容纳其（非包装）内容时，IE11不会收缩flex孩子

我已经检查了臭名昭著的IE flex bug（）并尝试了所有的解决方案

小提琴

.container{
显示器：flex；
}
.左{
柔性生长：1；
弹性收缩：1；
弹性基础：0px；
最小宽度：0px；
溢出：隐藏；
边框：1px纯红；
}
.中心{
flex-grow:0；
弹性收缩：0；
弹性基准：200px；
边框：1px纯绿色；
}
.对{
柔性生长：1；
弹性收缩：0；
弹性基础：0px；
边框：1px纯蓝色；
}

左
缩小为0
居中
固定宽度，始终居中（除非右栏太小，无法容纳其内容）
右
长内容\u无\u换行\u或\u溢出

flex basis

设置为

0

，将其删除或设置为

auto

，否则它将遵循规则，允许元素

0

的

宽度

的

基础

.container{
显示器：flex；
}
.左{
柔性生长：1；
弹性收缩：1；
弹性基础：0px；
最小宽度：0px；
溢出：隐藏；
边框：1px纯红；
}
.中心{
flex-grow:0；
弹性收缩：0；
弹性基准：200px；
边框：1px纯绿色；
}
.对{
柔性生长：1；
弹性收缩：0；
边框：1px纯蓝色；
}

左
缩小为0
居中
固定宽度，始终居中（除非右栏太小，无法容纳其内容）
右
长内容\u无\u换行\u或\u溢出

我还没有测试，但IE似乎需要flexbox的前缀。谢谢，但我特别针对的是IE11，它不需要flexbox的前缀，这确实解决了溢出问题！但是中间的一栏总是需要居中（除非右边的一栏太小，无法容纳它的内容）-你建议的更改不再是这样了。@AdriaanMeuris，确实我错过了那部分，我在答案中添加了一个可能的CSS变通代码段，让我知道它对您的表现，以及您是否认为它仅适用于IE11。澄清一下：

display:table

建议改为：

minwidth:max content，不受IE11支持，在这里不方便。