简单的flexbox示例在Internet Explorer 11中呈现不正确？

Question

考虑display: flex：

这个简单的例子

<div class="outer">
  <div class="inner">A</div>
  <div class="inner">B</div>
</div>

.outer {
  display: flex;
}
.inner {
  flex-grow: 0;
  flex-basis: 0px;
}

我测试过的大多数浏览器都会将其呈现为AB，但Internet Explorer 11会将A和B叠加在一起。

这是IE11中的错误吗？如果是这样，有没有办法调整CSS以使IE11正确呈现？

https://jsfiddle.net/oh6x73ca/

Answer 1

我添加了.inner {flex-basis: calc(100% - 0px;)} Css并进行了测试并且工作正常。