我有一个设置了高度的标头，但是它被忽略了，并且缩小到任何内容高度。 （请参见示例1）
我知道发生这种情况是因为父容器（示例中的<div class="container">
<div class="d-flex justify-content-between">
<div class="col justify-content-center flex-column d-flex">
left
</div>
<div class="col justify-content-center flex-column d-flex right">
<a href="/">right</a>
</div>
</div>
</div>
）具有.container div {
height: 100px;
background-color: red;
}
a {
background-color: blue;
}
.right {
text-align: right;
}
和body。但我需要这样做，因为在其他情况下，我希望其中一个孩子display: flex并填满视口的所有剩余高度。 （请参见示例2）
此外，只有在页面的高度大于视口时（换句话说，具有flex-grow: column和flex-grow: 1的父容器具有垂直滚动条），才会发生这种情况。
为什么会这样？
如果我改用display: flex可以解决...但是为什么忽略高度？
另一件事：在我正在做的工作中（不在示例中），如果父元素是flex-grow: column和min-height，则某些绝对定位的元素会错位，这使我提出了另一个问题：是好的做法是让整个应用程序由display: flex和flex-grow: column的父级包裹？