title: Sticky footer. html
body: <p>I have this very simple footer :</p>
  
  <pre><code>.footer{
      width:100%;
      background-color:#333;
      height:100px;
      position: absolute;  
      bottom: 0px; 
  }
  </code></pre>
  
  <p>and this container :</p>
  
  <pre><code>.container{
      position:relative;
      height:100%;
      width:980px;
      margin:0px auto;
  }
  </code></pre>
  
  <p>The container's (content) height is 100% so it is based on the amount of results you get from your search query. I want the footer to stick underneith the container at all time. And when you have no results I just want to have it at the bottom of the screen.</p>
  
  <p>I tried to give the container a padding-bottom the height of the container and change the posistion but it didn't help. Does anyone has an idea how to solve this?</p>