Прижать footer к низу

09.08.2015

Способ №1

<div id="container">
   <div id="header"></div>
   <div id="body"></div>
   <div id="footer"></div>
</div>

html,
body {
   margin:0;
   padding:0;
   height:100%;
}
#container {
   min-height:100%;
   position:relative;
   height:100%;
}
#header {
   background:#ff0;
   padding:10px;
}
#body {
   padding:10px;
   padding-bottom:60px;   /* Height of the footer */
}
#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Height of the footer */
   background:#6cf;
}

Способ №2

<div id="container">
 <div id="content"></div>
</div>
<div id="footer">My Sticky Footer</div>

html, body, #container { height: 100%; }
body > #container { height: auto; min-height: 100%; }
#content { padding-bottom: 3em; }
#footer {
 clear: both;
 position: relative;
 z-index: 10;
 height: 3em;
 margin-top: -3em;
}