Html 如何适应弹性项目'；flexbox中内容图像的宽度？

有一个

带

显示：flex，
伸缩方向：列
和固定的
高度
和
宽度
。存在包含图像的flex项。应用
最小高度：0
后，根据需要，图像垂直分布相等。但是flex项目还有一些额外的空间。我不能移除这个

我尝试了各种各样的东西，但没有运气。请帮忙


.a{
边框：1px红色实心；
宽度：200px；
高度：110px；
显示器：flex；
弯曲方向：立柱；
调整项目：灵活启动；
}
.a>分区{
边框：1px蓝色实心；
最小高度：0；
}
.a>div>img{
身高：100%；
}
只需将
高度：calc（100%/3）
添加到
.a>div

编辑：也适用于Firefox


.a{
边框：1px红色实心；
宽度：200px；
高度：110px；
显示器：flex；
弯曲方向：立柱；
调整项目：灵活启动；
}
.a>分区{
边框：1px蓝色实心；
最小高度：0；
高度：计算（100%/3）；/*3是柔性容器中的柔性项目*/
框大小：边框框；
}
.a>div>img{
身高：100%；
}
摆弄你的帖子，我不知道为什么，但在你的弹性物品中添加
高度：100%
是有效的

因此，解决方案是在flex项目中添加
height:100%


.a{
边框：1px红色实心；
宽度：200px；
高度：110px；
显示器：flex；
弯曲方向：立柱；
调整项目：灵活启动；
flex-grow:0；
}
.a>分区{
边框：1px蓝色实心；
最小高度：0；
身高：100%；
}
.a>div>img{
身高：100%
}

以下解决方案在Firefox上不起作用Firefox上不起作用