Advanced Search

Sticky Icky Footer

/ Published in: CSS
Save to your folder(s)
Also seen for now at carinsurancerates.com

Assembled this in 2008 and have used it numerous times since then, reliable chunk of code. Jquery can be used to add a nice slide down option like on carinsurancerates.com

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <html>
  2. <head>
  3. <style type="text/css">
  4. html > body #footer_wrapper {
  5.     bottom: 0;
  6.     position: fixed;
  7. }
  8.  
  9. #footer_wrapper {
  10.     bottom: 0;
  11.     padding: 0;
  12.     text-align: center;
  13.     width: 100%;
  14.     z-index: 110;
  15. }
  16.  
  17. #footer_wrapper {
  18.     font-family: Arial,Helvetica,sans-serif;
  19.     font-size: 12px;
  20.     margin: 0;
  21. }
  22.  
  23. #footer {
  24.     -moz-border-radius: 3px 3px 0 0;
  25.     background: url("/images/footer_bar.png") no-repeat scroll left top transparent;
  26.     border-bottom-width: 0;
  27.     bottom: 15px;
  28.     height: 54px;
  29.     margin: 0 auto;
  30.     padding-top: 22px;
  31.     text-align: left;
  32.     width: 940px;
  33.     z-index: 120;
  34. }
  35.  
  36. #footer_wrapper {
  37.     text-align: center;
  38. }
  39. #footer_wrapper {
  40.     font-family: Arial,Helvetica,sans-serif;
  41.     font-size: 12px;
  42. }
  43. </style>
  44.  
  45. <!--[if IE 6]>
  46. <link href="/css/ie6.css" rel="stylesheet" type="text/css" />
  47. <![endif]-->
  48.  
  49.  
  50. </head>
  51. <body>
  52. <div id="footer_wrapper">
  53.   <div id="footer">
  54. Footer stuff goes here
  55.  
  56. </div>
  57. </div>
  58. </body>
  59. </html>

URL: http://vr-3.com

Report this snippet


Comments

You need to login to view comments.