보기가 내용보다 작을 때 정적 내용 스크롤

Question

이것은 아마도 내가 만드는 것보다 훨씬 간단하지만이 문제를 파악하는 데 어려움을 겪고 있습니다.

오른쪽에 선택한 연락처 정보의 정적 미리보기가있는 왼쪽에 연락처 목록이 표시된 웹 페이지가 있습니다. 상단의 메뉴도 정적입니다. 현재, '거의'제대로 작동하고 있습니다. 연락처 미리보기 및 메뉴가 정적으로 유지되는 동안 마우스 스크롤 단추 또는 화면 스크롤 막대로 스크롤하면 연락처의 왼쪽 목록이 스크롤됩니다. 그러나 화면이 너무 작아 미리보기의 전체 내용을 표시 할 수없는 경우에만 오른쪽 섹션을 스크롤하고 싶습니다. 나는 '오버 플로우 : 자동'과 '오버 플로우 : 스크롤'을 성공없이 사용했다.

.scrollable { 
    overflow: auto; 
} 

이 문제를 해결할 수 있도록 도와 주시겠습니까? 하지만 난이 질문에 필요한 기능이 포함되어 생각하는 모든

http://jsfiddle.net/84BM8/7/

Answer 1

먼저 당신이 오버 플로우를 숨길 필요가 -. 여기

(모든 CSS와 코드가 포함되어 있지주의하시기 바랍니다 jsfiddle입니다 html 및 body의.

그럼 당신은 충분한 공간이 없을 때 올바른 콘텐츠가 오버 플로우 수 있도록 높이를 지정해야합니다.

.rightSection { 
    width: 45%; 
    float: right; 
    height:500px; 
} 

Demo