html - IE10 中的 flex-shrink

Question

我有一个 block ，其中有一个图像和另一个 block 。

父 block 有display:flex，使图像和子 block 排成一排。

子 block 也有 display:flex，但它形成了一个由段落和标题组成的列。

http://codepen.io/anon/pen/qNmYRq

.summary__testimonial{
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 120px;
    padding-top: 35px;
    max-width: 100%;
}

.summary__testimonial-right{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction:column;
    flex-direction:column;
    box-sizing: border-box;
    max-width: 100%;
    -ms-flex-negative:1;
    flex-shrink:1;
    -ms-flex-pack:center;
    justify-content:center;
    width: auto;
}

问题是文本段落在 IE 10 中溢出了他的 parent 。

我尝试设置 max-width:100%、width:auto、box-sizing:border-box、更改 flex-shrink 值到 1 和 0。

如果您在 IE 10 中打开它，它仍然会溢出或变成单行，这很可能是您在 codepen 中看到的情况。

有没有办法让它在 IE 10 中看起来与在普通浏览器中一样？

Answer 1

flex-shrink 的 IE10 等效项是 -ms-flex-negative

例如，

-ms-flex-negative: 0;