使弹性元素忽略子元素

Question

新手上路，请多包涵

是否可以使 flex 元素忽略子元素，使其大小不影响其他元素？

例如，我有一个带有 display: flex 的包装器。它有页眉、内容和页脚。

 <div class="wrapper">
    <header></header>
    <article></article>
    <footer></footer>
</div>

我希望包装器忽略标头标记（标头将固定在窗口顶部）。文章将被设置为 flex: 1 因此它占用了剩余空间，迫使页脚位于页面底部。这是一些示例 CSS：

 .wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-top: 50px; /* Accounts for header */
}

header {
    height: 50px;
    position: fixed;
    top: 0;
    width: 100%;
}

article {
    flex: 1;
}

footer {
    height: 50px;
}

我知道我可以将标头移到包装器之外，但我有很多现有代码会使这变得有点困难。我问的是可能的吗？