为什么 IE 忽略我的 Flex 容器的'min-height”属性？

IE 忽略 Flex 容器的最小高度

在 Internet Explorer 10 和 11 中，Flex 容器在达到最小高度时可能会表现出意外的行为。高度属性。虽然 Flex 容器应遵守定义的最小高度，但 IE 浏览器会忽略它。

为了解决此问题，存在一种解决方法，即使 Flex 容器本身成为 Flex 项目。通过将以下代码添加到 CSS：

body {
  display: flex;
  flex-direction: column;
}

，您可以有效地将整个页面转换为 Flex 容器。这使得 Flex 容器能够遵守 IE 中的 min-height 属性，同时保持预期的布局。

示例：

考虑一个具有两个子 div 的 Flex 容器，其中容器的最小高度为 400px，子 div 不大于 400px。在 Chrome 和 Firefox 中，布局将符合预期，一个子元素位于顶部，另一个子元素位于底部。但是，在 IE 中，容器会折叠到其内容的高度，而忽略 min-height 属性。

解决方案：

要解决此问题，请实现解决方法是使主体成为弹性容器。修改后的代码如下所示：

<div>

以上是为什么 IE 忽略我的 Flex 容器的'min-height”属性？的详细内容。更多信息请关注PHP中文网其他相关文章！