title: Footer won't stay in the bottom of the page
body: <p>I'm am having some trouble, trying to get my footer to stay at the bottom of my page and the only tutorials I can find has a fixed position, which I dont want it to. I just want the footer to stay at the bottom of the page, so if the copyright line is at 1000px down on the page, that is where the footer will be. Right now it is at the top of the page, right under the header which it isn't supposed to.</p>
  
  <p>My code (html):</p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="footer"&gt;
  
              &lt;div class="CopyrightLine"&gt;
              &amp;copy; Copyright
              &lt;/div&gt;
  
          &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>My code (css):</p>
  
  <pre><code>    #footer{
      width: 100%;
      height: 200px;
      background-color: #000000;
      float: left;
      bottom: 0;
  }
  </code></pre>
  
  <p>EDIT:</p>
  
  <p>I have now changed the code to look like this.</p>
  
  <pre><code>    #footer{
      width: 100%;
      height: 200px;
      background-color: #000000;
      bottom: 0;
      position: absolute;
  }
  
  .CopyrightLine{
      position: relative;
      left: 50%;
      margin-left: -70px; /*half the image width*/
      color: #ffffff;
  }
  </code></pre>
  
  <p>But it still wont work, even though I make alot of text on top, to try and make it move.</p>