IE对齐-内容中心溢出问题

Question

当在IE11上查看下面的演示时，会出现一个问题，在这个问题中，内容被正确地显示并推送到屏幕外。

Codepen Demo

下面是为内容中心辩护的代码：

.search-results {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

你可以在这个截图中看到这个问题：

​

我使用windows 10上的褐变层 IE 11来进行仿真。

它似乎在计算flex包装器的宽度，而不是实际的宽度。在元素、HTML或body上设置最大/宽度的数量似乎都无法修复它。据我所知，IE11对柔性盒有一些零碎的支持，我缺少了一个属性吗？供应商前缀是由Codepen添加的，因此我应该在此基础上进行介绍。

Answer 1

为了避免IE中的这些问题，应该设置灵活的基础.将“.搜索-结果_列表”的flex属性更改为flex: 0 1 712px。请查看下面的示例：

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

IE10-11不允许弯曲速记中无单位的弯曲基值.

欲了解更多信息：https://philipwalton.com/articles/normalizing-cross-browser-flexbox-bugs/