Question

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

父块有display:flex，以使图像和子块成为一排。

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

.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中溢出了他的父母。

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

如果你在IE 10中打开它，它仍然会溢出或成为单行，你可能会在codepen中看到它。

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

Answer 1

相当于tiles.get(i).member的IE10是flex-shrink

例如，

-ms-flex-negative

Answer 2

Internet Explorer 10使用older version of flexbox (2012)构建。

此版本不提供flex-shrink。该物业当时不存在。

请参阅Flexbox IE10 Property Index。

您可以获得的最接近的是-ms-flex属性，该属性设置为“负灵活性”（reference）。

另请参阅此答案：https://stackoverflow.com/a/35137869/3597276

IE10中的Flex-shrink

2 个答案: