title: Just can't make footer stay at the bottom
body: <blockquote>
    <p>When an HTML page contains a small amount of content, the footer can sometimes sit halfway up the page leaving a blank space underneath. This can look bad, particularly on a large screen. Web designers are often asked to push footers down to the bottom of the viewport, but it's not immediately obvious how this can be done.</p>
  </blockquote>
  
  <p>I have html structure like this: </p>
  
  <pre><code>&lt;html&gt;
    &lt;body&gt;
      &lt;div class="wrapper"&gt;
          ....
      &lt;/div&gt;
      &lt;div class="footer" id="cdFooter"&gt;
          .......
      &lt;/div&gt;   
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I tried as Internet said, set the css rules like this</p>
  
  <pre><code>html,body {
      position: relative;
      min-height: 100%;
  }
  
  .wrapper {
      min-height:100%;
      position: relative;
      overflow:hidden !important;
  }
  .footer {
      bottom: 0;
      width: 100%;
  }
  </code></pre>
  
  <p>(Some other css rule you can see at below URL, I can't put too much code here.)</p>
  
  <p>but the footer still not at the bottom of the browser if you are using a large screen desktop. You can see the result at this URL: <a href="http://dev.xinruima.me/readistep/" rel="nofollow">http://dev.xinruima.me/readistep/</a></p>
  
  <p>Someone says that, I need to set the wrapper has a rule like margin-bottom: **px, but that doesn't work for my site.</p>
  
  <p>Can someone take a look at my URL at see is there a way to solve this nicely? I want it to be responsive so I might not use a fixed height for pushing elements down or stuff like that.</p>
  
  <p>Thanks.</p>
  
  <p><strong>If I use position: absolute, it will overwrite the wrapper.</strong>
  <strong>I also use body {height: 100%}, it doesn't work for me. Can someone try to edit on my URL ?</strong></p>
  
  <p><strong>What I think the problem is, if we can make the height of body 100% tall as browser height, just like html did, it will solve the problem, hope so.</strong></p>