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中，這個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％的寬度就可以解決我的問題。

Answer 3

嘗試display: run-in或display: inline-block而不是display: -ms-flexbox ;