2012-12-04 2 views
0

고정 된 탐색 모음과 고정 된 사이드 바가있는 부트 스트랩 레이아웃을 작성하여 나머지 범위 (내용 범위)가 수직으로 스크롤되도록했습니다. 그러나 콘텐츠 범위가 실제로 창 헤더와 창을 포함하고 싶습니다. 즉, 창 헤더는 정적이지만 창 내용은 창 내에서 스크롤됩니다.스크롤 창을 포함한 부트 스트랩 레이아웃

.sidebar-nav-fixed { 
    padding: 9px 0; 
    position: fixed; 
    left: 20px; 
    top: 78px; 
    width: 250px; 
} 

.row-fluid > .span-fixed-sidebar { 
    margin-left: 290px; 
} 

.main { 
    margin-top: 80px; 
} 

.header { 
    margin-top: 80px; 
} 

.threadwindow { 
    height: 100%; 
    overflow: auto; 
    border: 1px solid #333; 
} 

여기 본 코드 http://jsfiddle.net/timburgess/CUGu8/

내가 어떤 제안을 감사하겠습니다을 기록했다. 나는 고정 된 위치 창 헤더하지만 윈도우 내용은 단순히 내가 원하는 것이 아니다 :-(어떤 위로 스크롤을 시도

답변

1

나는이 밖으로 일한 코어 CSS의 본질적이다.

#main { 
    position: absolute; 
    left: 300px; 
    top: 100px; 
    right: 0; 
    bottom: 0; 
    border: 2px solid #333; 
} 


.threadwindow { 
    position: absolute; 
    left: 0; 
    top: 50px; 
    right: 0; 
    bottom: 0; 
    border: 1px solid #333; 
    overflow-y: auto; 
} 

http://jsfiddle.net/timburgess/ZTt5M/

이 명확하게하기 위해, 내가 그것을 강조하기 위해 테두리 메인 창을 포위하고 그 안에 포함 된 이상 헤더를 허용 (테두리 다시) 하위 창입니다 :에서 완전한 결과는 서브 윈도우의 내용. ent가 사용 가능한 공간을 오버 플로우 할 경우 하위 창에서 세로로 스크롤하고 절대 위치 지정을 사용하면 기본 창의 오른쪽 및 아래쪽 테두리가 브라우저의 가장자리에 고정됩니다.

관련 문제