Как сделать контент div прокручиваемым без использования javascript

Question

У меня есть простая страница. Здесь я хочу, чтобы фиксированный заголовок и фиксированный нижний колонтитул, а тело содержимого было прокручиваемым.

HTML

<div class="container"> 
    <div class="header">This is Header</div> 
    <div class="body">This is Body 
     <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body 
    <br/>This is Body</div> 
    <div class="footer">This is Footer</div> 
</div> 

CSS

* { 
    margin: 0; 
    padding: 0; 
} 
.container { 
    width: 100%; 
    height: 100%; 
    background: #DDD; 
} 

.header { 
    width: 100%; 
    height: 40px; 
    background: red; 
    position: absolute; 
    top: 0; 
} 

.footer { 
    width: 100%; 
    height: 40px; 
    background: green; 
    position: absolute; 
    bottom: 0; 
} 

.body { 
    width: 100%; 
    background: blue; 
    overflow: auto; 
} 

Однако, когда я прокрутки, вся страница, как правило, для прокрутки, что делает мой верхний и нижний колонтитул ход. Я могу разрешить это с помощью javascript, получить высоту экрана и вычесть высоту заголовка и нижнего колонтитула.

Но есть ли способ, которым мы можем достичь этого, только с помощью css. Если да, то как?

Answer 1

Его очень просто, просто сделать изменения, как этот

.body { 
    width: 100%; 
    background: blue; 
    overflow: auto; 
    position: absolute; 
    bottom: 40px; 
    top: 40px; 
} 

Проверьте это http://jsfiddle.net/rCV6E/1/

Answer 2

попытаться использовать CSS, как:

.body { 
    width: 100%; 
    background: blue; 
    overflow: scroll !important; 
} 

Набор переполнение scroll и .header, .footer положение до fixed.