title: css-showing lot of space below footer
body: <p>See the image at this link:</p>
  
  <p><a href="https://docs.google.com/document/d/1r9L9eLBddMOdHAP3KfAx8ND-SF8b8zBl53o88aUbHT4/edit?pli=1" rel="nofollow">https://docs.google.com/document/d/1r9L9eLBddMOdHAP3KfAx8ND-SF8b8zBl53o88aUbHT4/edit?pli=1</a></p>
  
  <p>In the above image link, i have covered footer in black rectangle and i want it should be always on bottom last without any margin from bottom.</p>
  
  <p>Actually the problem arose when i deleted a div above the footer. 
  I am giving you the code responsible for this:</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="footer"&gt;
  &lt;div class="shell"&gt;
        &lt;!--content here--&gt;
      &lt;/div&gt;
       &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.shell { width:988px; margin:0 auto; }
    #footer { height:44px; background:url(images/footer.gif); line-height:44px;
       color:#fff;              
         }
       #footer a{ color:#fff; }
  </code></pre>
  
  <p>The css of div-box which is just above the footer. Actually this is responsible when i edited the margin-bottom yet i want to know how to make footer without space from bottom.
  Meanwhile CSS for div-box is:</p>
  
  <pre><code>    .box { background:#fbfcfc; height:100%; padding:1px; margin-bottom:10px; }
  </code></pre>
  
  <p>When i did margin-bottom:140px, it shows footer at the end. but i still want to know how to make footer at the bottom without space from bottom whether content is short or large.</p>
  
  <p>Please share your knowledge!</p>