header, footer {
display:block;
}
html, body, div, h1, h2, h3 {
margin: 0;
padding: 0;
}
html { background: #0f0f0f; }
body {
width: 700px;
margin: 0 auto 2em;
}
header {
background: rgb(76, 67, 65);
height: 96px;
padding: 32px 0 0 2%;
}
#conteudo { background: #fff; padding: 32px 2% 0 2%; }
footer {
background: rgb(100, 98, 102);
height: 50px;
padding: 32px 0 0 2%;
clear: both;
}
<!doctype html>
<html>
<head>
<title>Another Fixed Layout</title>
</head>
<body>
<header><h1>Another Fixed Layout</h1></header>
<div id="conteudo">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vitae libero quis libero suscipit dignissim sit amet eu velit. Morbi libero purus, vulputate vitae turpis ut, dictum condimentum magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras elementum suscipit elementum. Integer ante mi, rutrum vitae egestas id, condimentum mattis orci. Sed id hendrerit justo. Nullam congue sit amet nibh id imperdiet. Vivamus vitae nibh vel eros blandit mattis eget eu elit. Aenean gravida enim vel dolor faucibus, fermentum sodales augue porta. <br/><br/>
Aliquam id laoreet nulla. Etiam ut porta sapien, eget ultrices orci. Sed suscipit nisi turpis, a molestie velit hendrerit sit amet. Phasellus tortor ligula, sodales cursus sapien vitae, porttitor dapibus justo. Donec sagittis et lorem eget blandit. Praesent tristique finibus erat, vitae posuere nisi sagittis sed. Etiam tincidunt eu mi quis mollis. Pellentesque mattis dolor risus, vel ornare leo ultricies ut. Suspendisse consequat libero quis lacus dapibus, tristique sollicitudin justo sodales. Duis blandit lacus sit amet nisl ultrices varius. Morbi porttitor, nisi faucibus iaculis accumsan, diam dui sodales est, sit amet tempor diam mauris quis nisl. Aliquam nec convallis leo. Pellentesque lobortis, metus vel blandit iaculis, ante purus sodales elit, quis laoreet lorem augue molestie nunc. Suspendisse sagittis urna eu nisl ornare dignissim. Ut porttitor velit neque, vitae condimentum ligula aliquam a. <br/><br/>
Duis sagittis placerat ipsum, a pharetra turpis tincidunt sed. Nulla placerat venenatis justo sed tempus. Nunc congue justo eget luctus pharetra. Donec maximus velit lectus, quis eleifend libero interdum vitae. In faucibus vehicula dui, quis lobortis turpis condimentum sed. Phasellus condimentum elementum nunc ut aliquet. In sem ante, venenatis id viverra non, facilisis ut nulla. Donec ac lacinia tortor. Vivamus finibus mollis mauris. Aenean at eros ornare, hendrerit lorem et, bibendum tellus. Ut vel tortor placerat, dignissim nunc in, accumsan dui. Sed ac diam nec elit feugiat tristique. Cras non feugiat dui. In quis mollis diam, nec blandit neque. <br/><br/>
Curabitur tincidunt sed est vitae pretium. Duis at arcu finibus, ornare turpis nec, commodo dolor. Pellentesque elit diam, ullamcorper et pulvinar id, pharetra in ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed facilisis semper odio ut porta. Donec a vulputate justo, vitae finibus nulla. Donec nibh risus, commodo ac euismod et, sollicitudin quis erat.<br/><br/>
Nam vitae elit leo. Proin pretium, turpis rutrum posuere commodo, mauris sapien sodales nunc, at eleifend nunc lectus ut justo. Donec dui neque, hendrerit ut fermentum blandit, sagittis non nisi. Nulla nisi odio, sodales nec hendrerit in, aliquam at ligula. Pellentesque aliquam rhoncus hendrerit. Fusce venenatis ultrices dolor. Praesent ante ex, auctor in fringilla auctor, malesuada vitae mi. Nam dictum elementum iaculis. Nam rhoncus enim sit amet mauris finibus ullamcorper non quis neque. Cras felis nisl, porta ac molestie ut, venenatis et turpis. Phasellus eget convallis dolor, in ultricies sapien. Sed porttitor tortor ut rhoncus tempor. Donec id molestie enim, in consectetur nisl. Donec vel est id nunc euismod ornare in pulvinar ipsum. Integer volutpat elementum neque, id suscipit tortor scelerisque in. <br/><br/>
</div>
<footer>Copyright © 20XX -</footer>
</body>
</html>