title: How do I make the footer stretch vertically?
body: <p>I have a footer that is a 1 x 70px, which is set as the background and tiles horizonally.</p>
  
  <p>In cases when the web page does not contain a lot of content on it, it will display the footer above where the footer should be. I want it to fill in with a solid color, so if they scroll down, it won't show the footer, then the white under the footer.</p>
  
  <p>Here is the style I have for the footer.</p>
  
  <pre><code>.footer{
      background:#055830 url('/images/footer_tile.gif') repeat-x top left;
      color:#fff;
      font-size:12px;
      height: 70px;
      margin-top: 10px;
      font-family: Arial, Verdana, sans-serif;
      width:100%;
  }
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/pUzIQ.jpg" alt="alt text"></p>
  
  <p>I want the footer to look like this:
  <img src="https://i.stack.imgur.com/s96Ft.jpg" alt="alt text"></p>