title: Sticky footer in ember js
body: <p>I have emberjs application and I tried to create sticky footer.</p>
  
  <p>My html:</p>
  
  <pre><code>&lt;div class="main-container" id=""&gt;
    &lt;header&gt; HEADER &lt;/header&gt;
  
    &lt;div class="container"&gt;
      {{outlet}}
    &lt;/div&gt;
  
    &lt;footer&gt;
      footer text
    &lt;/footer&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The CSS:</p>
  
  <pre><code>.ember-view {
    height: 100%;
  }
  
  .main-container {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -40px;
  }
  
  footer {
    clear: both;
    line-height: 40px;
    width: 100%;
  }
  </code></pre>
  
  <p>For unknown reason the footer is still not stick to the bottom.</p>
  
  <p>Any idea?</p>
  
  <p>Thanks a lot :)</p>