Html Internet Explorer的Flexbox布局问题

使用此样式指南：，我的页面布局如下：

<header>
<main>
<footer>

除Internet Explorer外，所有浏览器都会显示网页，没有任何问题

---

我做错了什么？

在IE11之前的IE版本中，Flexbox不作为标准支持：

但是，您可以添加

-ms-

前缀以获得对IE10的支持。您的代码如下：

body {
  display: -ms-flex;
  display: flex;
  min-height: 100vh;
  -ms-flex-direction: column;
  flex-direction: column;
}
main {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}

---

旧版本的IE不支持flex:（嗯，我不确定.）从我所看到的，它似乎在11上工作，它应该是这样的吗？

body {
  display: -ms-flex;
  display: flex;
  min-height: 100vh;
  -ms-flex-direction: column;
  flex-direction: column;
}
main {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}