How to stretch a div so that it moves other divs to fit the window borders?

Question

css

I'm trying to "pull" the layout on wordpress. Split one page into several.
https://paulderden.000webhostapp.com/contacts/
I would like there to be no white space at the bottom, and the block with contacts would occupy the remaining space in the center.
I tried to set this block (class="contacts") to height: auto and 100%, etc.
I suppose that he will have to remove the padding, put

display: flex;
justify-content: space-between

But how to make the block with contacts "spread" the header and footer to the edges of the window?

Answer 1

html, body {
  height: 100%;
}
body {
  display: table;
  width: 100%;
}
#contacts {
  display: table-row;
  height: 100%;
}
#contacts > .container {
  display: table-cell;
  vertical-align: middle;
}

Answer 2

find the server first...