title: Attach div element to the bottom of page
body: <p>I have a page where the main content has a variable height. I want to have a fixed height (about 50px) footer to the very bottom of the page.</p>
  
  <p>I need it to scroll along with the page (so not a fixed position).</p>
  
  <p>A couple scenarios:</p>
  
  <p>If the body content is 300px tall, the window has no scrollbar, the footer would be all the way to the bottom and visible.</p>
  
  <p>If the body content is 900px tall and the window has a scrollbar, the footer would be all the way at the bottom with no space between the footer and the bottom of the window, and not visible unless you scroll to the very bottom.</p>
  
  <p>Is there a way to accomplish this in pure CSS? Trying to stay clear of using JS to handle this.</p>