3 个 div 在 flex 容器 div 之外扩展，导致元素重叠

Question

https://i.stack.imgur.com/MzDjK.png

（更新）我相信我找到了问题的根本原因。假设容器中有 2 个 div，高度为 300。如果我添加第三个 div，高度变为 320。我必须停止更改高度，因为添加了另一个 div。我希望第三个 div 挤进 300。如何阻止第三个 div 改变容器的高度？

    <div id="flex-container" style="display: flex; flex-direction: column">
           <div id=" a " style="flex-grow:1 ">
           </div>
           <div id="b " style="flex-grow: 1 ">
           </div>
           <div id="c " style="flex-grow: 1 ">
           </div>
    </div>

（原文）您好。如果你看图像。当前主页有 div A 和 div C 在您登陆时显示。当您更改下拉框中的值时， b 将添加到 flex 容器中。添加 b 将 C 推出弹性容器，导致它重叠。我不明白我做错了什么。我想将所有 3 个 div 保留在 flex 容器中。请给我一些反馈。

---

Answer 1

我不确定我是否理解了你的问题，但我会尽力回答。

我想你可以给它一个固定的大小，请试试这个 CSS：

#divId { width: 500px; height: 600px; overflow: auto }