title: Bootstrap 3 sticky footer at the bottom and 100% height container with content
body: <p>Here's my css rules:</p>
  
  <pre><code>html {
    position: relative;
    min-height: 100%;
  }
  body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
  }
  #footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
  }
  </code></pre>
  
  <p>Using this example: <a href="http://getbootstrap.com/examples/sticky-footer/" rel="nofollow noreferrer">http://getbootstrap.com/examples/sticky-footer/</a></p>
  
  <p>I can make sticky footer without any issues, however there's one problem. How can i make content container to be full height 100%?</p>
  
  <p><img src="https://i.stack.imgur.com/VUvoF.png" alt="enter image description here"></p>
  
  <p>I want to fill this gray background color to the footer. How is that possible? I spent 8 hours already to figure out that. Please, help.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p><a href="http://jsfiddle.net/3wh7d612/1/" rel="nofollow noreferrer">http://jsfiddle.net/3wh7d612/1/</a>
  Pay attention to div with class <code>container2</code> i want to make it full height till the footer.</p>