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

Question

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

（更新）我相信我找到了问题的根本原因。假设容器中有2个div，高度为300.如果我添加第3个div，则高度变为320.我必须停止更改高度，因为添加了另一个div。我希望第3个div挤进300.我如何阻止第3个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推出Flex容器，导致其重叠。我不明白我做错了什么。我想将所有3个div保留在flex容器中。请给我一些反馈。

Answer 1

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

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

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