Html 柔性柱子柱溢流高度

我有一个简单应用程序的框架，其中包含顶部标题、内容区域和页面容器，如下所示：

.container{
高度：100vh；
宽度：100%；
显示器：flex；
弯曲方向：立柱；
背景色：红色；
}
.appheader{
宽度：100%；
背景色：#cdcdcd；
颜色：蓝色；
文本对齐：居中；
}
.appcontent{
宽度：100%；
身高：100%；
背景颜色：蓝色；
}
.appcontentheader{
宽度：100%；
背景色：黑色；
颜色：白色；
文本对齐：居中；
填充：10px；
}
.第页{
显示器：flex；
弯曲方向：立柱；
背景颜色：黄色；
保证金：0px 50px 0px 50px；
宽度：100%；
身高：100%；
}
.pagetitle{
背景颜色：灰色；
颜色：橙色；
文本对齐：居中；
}
.网页内容{
填充：20px；
背景颜色：灰色；
颜色：橙色；
}

我的应用程序菜单
章节标题
页面标题

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。二人世界
这是一种令人厌恶的行为，因为它是一种不平等的行为。除偶尔因疏忽而死亡外，不得因疏忽而导致动物死亡。

您还需要将flex box应用于其包装中的页面内容：

.page{    
  display: flex;
  flex-direction: column;
  ...
}

这将确保允许页面内容根据您的布局进行正确调整