Question

我一直在尝试在IE错误列表中解决这个问题，但似乎无法在那里找到它。它通过避免内部元素（.inner） - flex: 1上的速记flex声明来解决; - ＆GT; flex: 1 1 auto;。

你能帮帮我吗？

.flex-container {
  display: flex;
  flex-flow: row wrap;
}

.flex-item {
  display:flex;
  flex: 1;
  flex-direction: column;
  outline: 1px solid;
}

.inner {
  flex: 1;  
}

<div class="flex-container">
  <div class="flex-item">
    <div class="inner">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam quidem cum quod, sed iure aspernatur enim nihil vitae eos ullam molestias possimus quia repellat, delectus, rem est quibusdam. Ipsum, perspiciatis.
    </div>
  </div>
  <div class="flex-item">
    <div class="inner">
    lorem
    </div>
  </div>
  <div class="flex-item">
    <div class="inner">
    lorem
    </div>
  </div>
  <div class="flex-item">
    <div class="inner">
    lorem
    </div>
  </div>
  </div>

实际问题是Flex items overflowing parent in IE11

Answer 1

此问题由flex: 1 0 auto而非flex: 1

修复

IE11上的Flexbox问题

1 个答案: