IE10中的Flex项目内容溢出

Question

我有以下HTML代码：

<div class="flex-container">
    <div class="flex-item">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit fusce vel sapien elit in malesuada semper mi, id sollicitudin urna fermentum ut fusce varius nisl ac ipsum vel pretium tellus.</p>
    </div>
</div>

和以下CSS：

.flex-container {
    border: solid 1px black;
    display: -ms-flexbox;  /* For IE10 */
    display: flex;  /* For modern browsers. */ 
}

代码可在jsFiddle中找到。 不幸的是，在IE10内部'p'标签会导致溢出，但在现代浏览器中一切都可以。如何在IE10中修复它？

Answer 1

在IE 10中测试过。请参阅JSFiddle

修复css如下：

.flex-container {
    border: solid 1px black;
    display: flex;  /* For modern browsers. */
    display: flexbox;  /* For IE10 */
}