print page footer in html code example

Example 1: create fooer on print page with jquery

footer {
  font-size: 9px;
  color: #f00;
  text-align: center;
}

@page {
  size: A4;
  margin: 11mm 17mm 17mm 17mm;
}

@media print {
  footer {
    position: fixed;
    bottom: 0;
  }

  .content-block, p {
    page-break-inside: avoid;
  }

  html, body {
    width: 210mm;
    height: 297mm;
  }
}

Example 2: membuat footer html

<div id="container">
    <div id="header">
        <h1>Layout Footer Menempel Ke Bawah</h1>
    </div>
    <div id="content">
        <!--Bisa diisi teks lorem ipsum dibagian ini-->
    </div>
    <div id="footer">
        Copyright © 2014
        Designed by ..............
    </div>
</div>