css 3 divs 포지셔닝, 오버플로가있는 스크롤 : scroll

Question

이 피들을 보면 : http://jsfiddle.net/kamilszokaluk/uhmYg/ 나는 3 개의 div가 있습니다. 상단은 페이지 상단에 있고 보이는 부분의 하단에는 스크롤하지 않음). 그들은 움직이지 않는다. 그래서 나의 첫 번째 생각은 그들의 위치를 ​​정하는 것이었다 : 위쪽으로 고정 : 처음과 하단은 0, 초는 0이다. 하지만 내 목표는 스크롤하는 유일한 div는 "content"div입니다. 위에서 언급 한 위치를 설정하면 전체 페이지를 스크롤 할 수 있습니다. 의도 된 레이아웃은 다음과 같이이다 :

_________________   __ 
|     |   | 
|  upper  |   | 
|_________________|   | 
|    ||   | 
| content with ||   | 
| scroll  ||   |---your browser window 
|    ||   | 
|________________||   | 
|     |   | 
| lower  |   | 
|_________________|  __| 

그것이 변화 원인, "내용"의 높이를 무시 할 수 있습니까?

Answer 1

나는 당신의 문제는 당신이 그것을 채우려하기 때문에 그냥 .content에 고정 된 높이를 설정할 수 있다는 것입니다 생각 어떤 나머지 중간 공간이 자동으로 있습니까?

이 경우 비율 높이를 사용해야하거나 기본 div 아래쪽 div에서 페이지 하단까지 음수 여백을 하단 div의 높이와 동일하게 늘리는 것이 좋습니다. .

또는 같은 중간 DIV 단지 절대 위치 : http://jsfiddle.net/uhmYg/9/

편집 : ... 내가 볼 유일한 해결책은 JQuery와 추가 절대 예를

Answer 2

추가 한 후 .content과에 대한 고정 높이를 설정 overflow-y:scroll;

데모 : http://jsfiddle.net/uhmYg/4/