html5: flexbox de três linhas com meio fixo superior / inferior e rolável

É possível fazer umahtml5 layout de flexbox com fixoheader/footer e um rolávelarticle seção como o seguinte paraRaposa de fogo 24 ecromo 31?

+----------+
| header   |
+----------+
| article ||
|         ||
|         ||
|         ||
+----------+
| footer   |
+----------+

Eu tentei isso (simplificado):

body {
  display: flex;
  flex-direction: column;
}
header {
  flex: 1;
}
article {
  flex: 8;
  overflow-y: scroll;
}
footer {
  flex: 1;
}

e agora estou tentando preencher o espaço restante com oarticle, mas se a altura do conteúdo for menor que a altura da janela, o rodapé não será fixo e, se for maior, o rodapé rola para fora da área visível ...

questionAnswers(1)

yourAnswerToTheQuestion