Section to fill remaining viewport area

[sonanski]

I’m trying to get the second section on my page to fill the remaining viewport area. I’ve done this before with straight hardcoding, but I can’t get it to work in X Theme.

http://www.scottonanski.com

Ive set min-height: 100vh; but it seems to be calculating the entire view area and sizing it to that.

[ruenel]

Hello There,

Thanks for writing in! You must calculate the minimum height like:

min-height: calc( 100vh - 300px);

300 pixel is just an example heights of the existing section that has a height of 300. You may reduce or increase if needed for your site.

Hope this helps.