<div class="header">header</div>

<div class="content">
xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>
xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>
xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx<br/>xxxxx
</div>

<div class="footer">footer</div>

.header {
    position:absolute; top:0; left:0; right:0;
    height:20px;
    background-color:#6E919A;
}
.content {
    position:absolute; top:20px; bottom:20px; right:0; left:0;
    background-color:#9BC9D1;
    overflow:auto;
}
.footer {
    position:absolute; bottom:0; left:0; right:0;
    height:20px;
    background-color:#6E919A;
}

jsFiddle