Internet Explorer 10 Flexbox：来自的线路 元素不会破坏（+ Codepen）

Question

我有IE10的flexbox问题。

看看这个片段：

.main {
    background: gray;
    margin: 0 auto;
    max-width: 600px;
}

.box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: wrap row;
    flex-flow: row wrap;
}

<div class="main">
    <div class="box">
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
    </div>
</div>

图片：http://s23.postimg.org/x70atnojd/ie10.jpg

flexbox容器中的段落元素不会中断。任何想法如何解决这一问题？

Answer 1

您需要为flexbox中的元素添加宽度。

因此，段落标记上的宽度应该可以解决问题。

.box p {
    width: 100%;
}