flex布局多层嵌套自动适应高度，导致 overflow: auto 失效
# Flex 布局中,flex: 1 和 overflow: auto 应用于第二层的元素时,overflow: auto 失效
在嵌套的 Flex 布局中，当你将 flex: 1 和 overflow: auto 应用于第二层的元素时，可能会导致 overflow: auto 失效。这是因为默认情况下，Flex 容器的子元素会根据内容自动撑开，而不考虑 overflow 属性。
要解决这个问题，你可以使用 min-height: 0 来强制第二层元素限制其高度，并启用滚动条。同时，还需要确保父容器也具有适当的高度或最大高度限制。
以下是一个示例代码，展示如何在嵌套的 Flex 布局中设置 flex: 1、overflow: auto 并使其生效：
```css
.container {
display: flex;
flex-direction: column;
height: 35rem; /* 设置容器的固定高度 */
}
.flex1 {
flex: 1;
min-height: 0; /* 强制限制元素高度 */
overflow: auto; /* 显示滚动条 */
}
```