Thursday, 26 September 2013

Menetapkan Kedudukan Footer Sentiasa di Bahagian Bawah Web Page

KOD CSS (layout.css)

* {
  margin: 0;
}


html, body {
  height: 100%;
}


.wrapper {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto -4em;  /* ketinggian footer dalam negatif */
}


.footer, .push {
  height: 4em; 
/* ketinggian footer */ 
}


KOD HTML

<html>
  <head>
   <link rel="stylesheet" href="layout.css" ... />
  </head>
  <body>
    <div class="wrapper">
      <div class="content">
        <p>Your website content here.</p>
      </div>
      <div class="push"></div>
    </div>
    <div class="footer">
      <p>2uk3y (c) 2013</p>
    </div>
  </body>
</html>

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

0 comments:

Post a Comment