HTML CSS examples for CSS Widget:Footer aligned bottom
Place footer to the bottom
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> html, body { height:100%; } #global {<!--from ww w .j a va 2s.c o m--> min-height:100%; } #content { overflow:auto; padding-bottom:151px; } #footerbottom, #global:after { height:100px; } #global:after { content:""; display:block; } #footerbottom { background:red; position:relative; margin-top:-100px; height:100px; clear:both; } </style> </head> <body class="pages"> <div id="global" class="global"> <header class="fixed"></header> <section id="content"> <p>Lorem ips<br>Lorem ips</p> </section> </div> <!--end global--> <div id="footerbottom"> Lorem ipsum </div> </body> </html>