flexbox - IE11 Flexbox 问题 : bootstrap 4 card height is maximum of child card-body "img-fluid"

Question

我正在 Bootstrap 4.0.0 中开发一个模板，该模板将用于包含许多(50+)混合比例图像的多个图库页面。我有一个网格布局，除了 IE11 之外都运行良好。我的图像位于按钮内部的卡片内，并且卡片高度似乎拉伸(stretch)到响应图像的最大高度。

• 我需要帮助确定是否有办法使 IE 11 中的框的高度和宽度缩小。(宽度部分正常)
• 我想保留我所拥有的:列等高，图像居中，文本位于底部，而不是与图像底部混在一起。
• 如果我在 IE 的 DOM 资源管理器中的“card”类下取消选中 display:flex，我会对得到的结果感到高兴(仅适用于 IE)。它减小了卡片的尺寸，但我失去了垂直居中。所以这不是一个好的整体解决方案。

我自动添加了前缀，并使用 this flexbox bug page 上的选项但没有成功。

我尝试将代码包含在代码片段中，但它不起作用，所以我将提供此 link to a bootply:

IE11 问题的屏幕截图显示列高太高:Link

显示网格在其他浏览器中的外观的图像 Link

一切都适用于所有现代浏览器、屏幕尺寸和设备，除了占访问者 10% 的 IE11。 (我不担心任何不支持 bootstrap 4.0 的旧版本，例如 ie9 或 safari 8)

Answer 1

这适用于 IE 10 和 11 卡高度问题:已修复

* {
   min-height: 0.01px;
}