Monday, April 8, 2013

Footer Fixes - Another Way by Matthew Taylor


  1. <body>
  2. <div id="wrapper">
  3. <div id="header"></div>
  4. <div id="content"></div>
  5. <div id="footer"></div>
  6. </div>
  7. </body>
====================

CSS



html,
body {
margin:0;
padding:0;
height:100%;
}

#wrapper {

min-height:100%;
position:relative;
}

#header {

padding:10px;
background:#5ee;
}

#content {

padding:10px;
padding-bottom:80px; /* Height of the footer element */
}

#footer {

width:100%;
height:80px;
position:absolute;
bottom:0;
left:0;
background:#ee5;
}


    http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.