Footer is positioned at viewpoint height instead of being positioned below the content of the page

Question

I am trying to create a single page website using relative units (vh; em; rem) for the first time but the footer wouldn\'t stay at the bottom and for different screen sizes