为什么在IE11中包装溢出容器的flex项?

时间:2016-01-18 14:33:27

标签: html css css3 flexbox internet-explorer-11

我无法理解为什么我的flexbox代码不能在IE11上运行。它在Chrome中没问题。

它应该居中,但这是它在IE11中的作用:

enter image description here

HTML

<div>
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul> 
</div>

CSS

body {
  padding: 40px;
  margin: 0;
}
div {
  box-content: border-box;
  width: 800px;
  overflow: hidden;
}
ul {
  display: flex;
  flex-flow: row wrap;
  background: blue;
  list-style-type: none;
  padding: 0;
  justify-content: center;
  margin: 0 0 -10px -20px;
}
li {
  flex-grow: 1;
  min-width: 260px;
  max-width: 340px;
  height: 260px;
  background: red;
  margin: 0 0 10px 20px;
}

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

0 个答案:

没有答案