Html 如何在另一个flex元素中修复flex元素中的标题

我正在尝试修复flex div中的标题，并允许它的其余部分滚动（如果需要）。请注意，flex div内容的标题和其余部分通常可以是任意高度。我曾多次遇到过这个问题，例如，具有固定标题和可滚动内容的表，看到了许多丑陋的jQuery或不是那么动态的解决方案。我希望flex是唯一的解决方案，请帮我把它做好

正文{填充：0；边距：0；} p{页边距底部：17px；} .wrapper{宽度：100%；高度：200px；边距：0自动；边框：1px实心000；框大小：边框框；} .flexContainer{display:flex；flex wrap:nowrap；对齐内容：间距；弯曲方向：行；对齐项目：拉伸；宽度：100%；高度：100%；框大小：边框框；边框：1px实心f00；} .firstCol{宽度：32%；框大小：边框框；顺序：1；边框：1px实心f00；} .secondCol{width:32%；框大小：边框框；顺序：2；边框：1px实心0f0；框大小：边框框；溢出：自动；} .secondCol.innerFlex{height:100%；display:柔性；柔性方向：行；柔性包裹：包裹；对齐项目：拉伸；对齐内容：间距；宽度：100%；框大小：边框框；柔性：自动；溢出：隐藏；} .secondCol.innerFlex.innerFlexContainer{} .secondCol.innerFlex.firstItem{边框：1px实心00f；宽度：100%；顺序：1；flex增长：0；} .secondCol.innerFlex.secondItem{border:1px solid 00f；宽度：100%；aling self:flex end；框大小：border box；display:block；order:2；flex grow:1；溢出：scroll；} .thirdCol{宽度：32%；框大小：边框框；顺序：3；边框：1px实心f0f；框大小：边框框；} 这是我想要修复的标题，所以要让它始终可见。 123456 123456 123456 123456 123456 123456 123456 123456 123456 123456 123456 123456 789

---

您的css中缺少以下内容：

.secondCol .innerFlex .innerFlexContainer {
    height: 100%;
    display: flex;
    flex-direction: column;
}

---

您将这些属性添加到了错误的元素：.secondCol.innerFlex，它不是固定和可滚动元素的直接父元素。

您不想在任何内容上设置像素高度吗？我需要它尽可能通用，并且在任何分辨率上都不留未使用的空间。