Flexbox在IE中似乎不起作用

-1

對於某個網站，我使用了一些柔性盒。除IE之外，這些框在所有瀏覽器中都能很好地工作。我想給你的下面我在做什麼的簡化版本：Flexbox在IE中似乎不起作用

<div class="row-fluid vertical-align text"> 
      <div class="col-xs-16 col-md-8 leftText"> 
       Some textblock, which has a 10 lines 
      </div> 
      <div class="col-xs-16 col-md-8 rightText"> 
       Some other textblock. 

      </div> 
</div>

CSS：

.vertical-align { 
    display: flex; 
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ 
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ 
    display: -ms-flexbox; /* TWEENER - IE 10 */ 
    display: -webkit-flex; /* NEW - Chrome */ 
    align-items: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    min-height: 100%; 
}

不能在IE工作..工程就像在Chrome和FF魅力甚至Safari。任何人？

來源

2015-05-23 Kornelito Benito

哪個版本的IE？什麼不工作？它應該如何工作？ – Oriol

我只在IE 11中試過。 –

我通常會看到-ms-flex：1和-ms-flex-pack：center;在CSS上的某處用於垂直居中-ms-flexbox內的內容 –

解決了這個問題，對於IE來說，我必須在.vertical-align類中指定一個高度（以像素爲單位）。其他瀏覽器不需要這些。在這裏，以百分比來指定高度已經足夠了。

來源

2015-05-26 07:52:15

請注意，您需要將'display：flex;'作爲最後一條規則。不是第一個，就像你的例子。 – hexalys

Flexbox在IE中似乎不起作用

回答

相關問題