Posted By

flicity on 04/07/10


Tagged

css layout min-height


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

wirenaught


Sticky footer


 / Published in: CSS
 

URL: http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

  1. html, body {
  2. height: 100%;
  3. }
  4. .wrapper {
  5. min-height: 100%;
  6. height: auto !important;
  7. height: 100%;
  8. margin: 0 auto -4em;
  9. }
  10. .footer, .push {
  11. height: 4em;
  12. }
  13.  
  14. <html>
  15. <head>
  16. <link rel="stylesheet" href="layout.css" ... />
  17. </head>
  18. <body>
  19. <div class="wrapper">
  20. <p>Your website content here.</p>
  21. <div class="push"></div>
  22. </div>
  23. <div class="footer">
  24. <p>Copyright (c) 2008</p>
  25. </div>
  26. </body>
  27. </html>

Report this snippet  

You need to login to post a comment.