머리글, 바닥 글 및 외부 div를 고정하고 내부 div를 스크롤 가능하게 유지하는 방법

Question

이 부분을 보시고 http://jsfiddle.net/jaseem/sS7HN/을 보시기 바랍니다. 달성하고자하는 것은 내부 스크롤 막대 대신 기본 창 스크롤 막대를 사용하려는 것입니다. 그래서 나는 "innerContent"안에있는 내용을 살펴보기 위해 창 수직 스크롤 막대를 사용할 수 있지만, 동시에 바깥 쪽 div를 고정시키고 싶습니다. 그게 가능하니?

CSS :

header { 
    position: fixed; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 50px; 
} 

footer { 
    position: fixed; 
    left: 0; 
    bottom:0; 
    width: 100%; 
} 

content { 
    background-color:#656565; 
    width: 940px; 
    margin:0 auto; 
    padding-top:10px; 
    border-radius:5px; 
} 

mainContent { 
    margin:0px auto; 
    background-color:#515151; 
    width:660px; 
    border-radius:5px; 
    padding-top:20px; 
} 

contentHolder { 
    margin:0 auto; 
    width:616px; 
    background-color:#000000; 
    border-radius:10px; 
    overflow:auto; 
} 

HTML :

<div id="header"></div> 
<div id="content"> 
    <div id="mainContent"> 
     <div id="contentHolder"></div> 
    </div> 
</div> 
<div id="footer"></div> 

Answer 1

그것은 당신이 달성 하려는지 조금 불분명,하지만 난 당신이 당신의 CSS에 해시 태그를 누락 발견했다. ID 속성을 나타내는 경우 ID 앞에 #이 필요합니다.

예 : http://jsfiddle.net/hgcax/

CSS

당신이 당신의 DIV 이름 contentHolder 그래서 그 #contentHolder

이 같은 시도 여기 #div 이름을 부여해야 DIV 요소에 대한

#header { 
    position: fixed; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 50px; 
} 

#footer { 
    position: fixed; 
    left: 0; 
    bottom:0; 
    width: 100%; 
} 

#content { 
    background-color:#656565; 
    width: 940px; 
    margin:0 auto; 
    padding-top:10px; 
    border-radius:5px; 
} 

#mainContent { 
    margin:0px auto; 
    background-color:#515151; 
    width:660px; 
    border-radius:5px; 
    padding-top:20px; 
} 

#contentHolder { 
    color:#fff; 
    margin:0 auto; 
    width:600px; 
    height: 400px; 
    background-color:#000000; 
    border-radius:10px; 
    overflow:auto; 
}​ 

Answer 2

:

#contentHolder { 
overflow:auto; 
} 

또는

#contentHolder { 
overflow:scroll; 
}