Internet Explorer 11 flexbox问题

Question

我编写的代码可在除IE 11之外的所有已测试浏览器中使用。问题似乎在这里：

#wrapper {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    position: relative;
    top: 1em;
}

如果我删除flex，它将变得更易于管理，但是有了它们，它将所有内容缩小到这个长而狭窄的div上，直到永远存在。

如果我在IE 10中进行测试会有所帮助吗？

Answer 1

您只需要flex：1; 它将解决IE11的问题

#wrapper {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: -o-flex;
display: flex;
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
height: 100%;
position: relative;
top: 1em;
flex:1;
}

Answer 2

简单地向主体添加 100% 宽度就解决了我的问题。