Full page height with margin-top as minimum height of content block

David Sen Visit User Profile
Solved
david-sen ・

May 4th, 2020 05:55 PM

Hello guys,

I'm dealing with a page where I would like to have margin-top of the content block, and my primary wish is that the content block takes all the remaining height of the page even if there is not enough content.

My example is here: https://jsfiddle.net/c8207bj1/

Do you have any tip, please?

Report
DigitalOcean Laravel News Genesis
david-sen ・

May 11th, 2020 08:51 PM

・

Best Answer

One possible solution with height 100% of parent containers and min-height 100% of children: https://jsfiddle.net/3fe7cd28/1/

The second solution: flex layout in column with flex-grow property of children.

Report