<body>
<div class="wrapper">
<header class="myHeader">
HEADER
</header>
<section class="content">This is the body</section>
<footer class="myFooter">Footer</footer>
</div>
</body>
html, body {
height: 100%;
min-height: 100%;
margin: 0px;
border: 0px;
padding: 0px;
outline: 0px;
}
body {
position: relative;
overflow: hidden;
}
header {
text-align: center;
padding: 20px 0px;
background-color: #C8C8C8;
vertical-align: middle;
}
.wrapper {
min-height: 100%;
position: relative;
}
.content {
height: 100%;
min-height: 100%;
padding-bottom: 75px;
}
footer {
height: 75px;
text-align: center;
position: absolute;
bottom: 0px;
background-color: #DC3522;
width: 100%;
color: white;
}