HTML CSS examples for CSS Widget:Footer
Fluid height main body with header and footer
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> html, body, #container { height:100%; } body {<!--from ww w . j a v a2 s . c om--> z-index:2; position:relative; } body>#wrapper { height:100%; margin:0 auto; width:401px; } body>#wrapper>#header { z-index:4; position:relative; height:100px; background:Chartreuse; } body>#wrapper>#container { z-index:3; position:relative; height:auto; min-height:100%; background:yellow; margin-top:-100px; padding-top:100px; padding-bottom:100px; box-sizing:border-box; margin-bottom:-100px; } body>#wrapper>#footer { height:100px; background:blue; color:pink; z-index:4; position:relative; } </style> </head> <body> <div id="wrapper"> <div id="header"> Lorem ipsum dolor sit amet, co </div> <div id="container"> <div id="content"> Lorem ipsum dolor s </div> </div> <div id="footer"> Lorem ip </div> </div> </body> </html>