title: Stuck with movement of footer when content size increases
body: <p>I am stuck with a problem for quite a while now.I have googled and have tried almost all the responses and none of them has worked..
  I have a PHP page which has following layout</p>
  
  <pre><code>&lt;div id="wrapper"&gt;
  &lt;div id="header"/&gt;
  &lt;div id="content"/&gt;
  &lt;div id=footer/&gt;
  &lt;/div&gt;       
  </code></pre>
  
  <p>Now the contents of the content div comes from Db and usually takes up much more height than browsers window size.</p>
  
  <p>Here is the CSS that I have used</p>
  
  <pre><code>#footer { 
      color: #707070; 
      clear: both;
  
      min-height: 100px;
  
  }
  
  #content {
      width: 100%;
      min-height: 400px;
      margin-bottom: 25px;
  }
  </code></pre>
  
  <p>But when the size of that div increase the footer does not move below it rather the footer is shown in the middle of the content div but 1 layer below it.
  Can anyone help me?</p>