[Solved] FOOTER div wont to be at bottom and get over another divs [closed]


To achieve it your page structure needs to look like that

HTML

<html>
<body>
     <div class="content">

     <!-- all your page content goes here with header -->


           <div class="stop"></div>
     </div>

     <div class="footer">
     </div>
</body>
</html>

CSS

    html{height:100%}
    body{height:100%;margin:0}
    .content{height:auto !important;min-height:100%}

   .stop{height:40px;clear:both}
   .footer{width:100%;height:40px;background-color:red;margin-top:-40px}

.stop elements will prevent footer from overlapping your content, also needs to be set to height of your footer.

.footer needs to have minus margin equals its height.

Footer will always stay on the bottom of the page

http://jsfiddle.net/Du94N/1/

solved FOOTER div wont to be at bottom and get over another divs [closed]