小编Guy*_*ner的帖子

我试图防止 Flexbox 子项溢出其容器，但在子 div 上使用 Overflow:auto 似乎不起作用。

我的基本设置：我有一个包含 2 个 div 的 Flexbox 容器，A 和 B。A div 有 2 个内部 div，A1 和 A2，B div 只有一个内部 div B1。我试图保持 A1 和 B1 静态，并在 A2 溢出时在 A2 上显示滚动条。

html:

<div class="wrap">
  <div class="A">
    <div class="A1">A1</div>
    <div class="A2">A2</div>
  </div>
  <div class="B"><div class="B1">B1</div></div>
</div>

CSS

.wrap {
  display: flex;
  flex-direction: column;
  Height: 400px;
  justify-content: space-between;
  background-color: gray;
}

.A {
  display: flex;
  flex-direction: column;
  flex: 1, 1, auto;
}

.B {
  display: flex;
  flex-direction: column; …