title: How to keep footer at the bottom even with dynamic height website
body: <p>How do I keep a footer div always at the bottom of the window when I have a page that dynamically set the height (get info from database, for example) with CSS?</p>
  
  <hr>
  
  <p>If you want to do with jQuery, i came up with this and works fine:</p>
  
  <p><strong>Set the CSS of your footer:</strong></p>
  
  <pre><code>#footer { position:absolute; width:100%; height:100px; }
  </code></pre>
  
  <p><strong>Set the script:</strong></p>
  
  <pre><code>&lt;script&gt;
    x = $('#div-that-increase-height').height()+20; // +20 gives space between div and footer
    y = $(window).height();    
    if (x+100&lt;=y){ // 100 is the height of your footer
      $('#footer').css('top', y-100+'px');// again 100 is the height of your footer
      $('#footer').css('display', 'block');
    }else{
      $('#footer').css('top', x+'px');
      $('#footer').css('display', 'block');
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>This script must be at the end of your code;</p>