When trying to address the common issue of making the footer stay at the bottom of a page, one popular solution is to enclose everything in a div with position:relative and min-height:100%, as explained in this helpful tutorial here.
The challenge arises when there are nested divs within the wrapper that require a specific height set in percentages (e.g., height:70%). In order to achieve this, it becomes necessary for the wrapper div to have a fixed height of 100%, rather than using min-height:100%.
So the question remains: How can the footer be made to stick at the bottom while still accommodating inner divs with percentage-based heights?