Ever wanted to make a div stretch vertically according to the browser window's height?
One solution that instantly appears into our mind is height:100%. But this doesn't work as desired. The reason being % a relative unit. So when we give 100% height to a div element, it takes up all the height of its parent element. That surely is, 100% height.
So, how do we solve this? html and body are parent elements for all other elements, and the default value for these is height:auto;, so we change the height for both of them to 100% and same for the div element that we want to stretch.
The code will explain you better.
<div class="container">The height of this DIV element is 100% of the browser's window.</div>