How can an html element fill out 100% of the remaining screen height, using css only?

Question

I have a header element and a content element:

#header
#content

I want the header to be of fixed height and the content to fill up all the

Answer 1

You can use vh on the min-height property.

min-height: 100vh;

You can do as follows, depending on how you are using the margins...

min-height: calc(100vh - 10px) //Considering you're using some 10px margin top on an outside element