항상 볼 수있는 수직 스크롤 가능한 내용과 고정 된 바닥 글로 DIV를 만드는 방법은 무엇입니까?

Question

는 HTML과 같은 STH이어야한다 (형식 및 서식 미안하지만 난 HTML 샘플을 게시하는 방법을 모른다) 다음

<div id="dialog-window"> 
    <div id="scrollable-content"> 
    what ever content here...div's, ul's and li's 
    </div> 
    <div id="footer"> 
    </div> 
</div> 

난 항상 수직 스크롤을하는 것입니다 찾고 있어요 결과 만 내용과 바닥 글은 항상 대화 상자 창 아래쪽에 표시되어야합니다. 대화 상자 창은 고정 된 크기의 대화 상자입니다.

나는 여기 다른 게시물의 아이디어로 시도했지만 모든 요구 사항에 맞지는 않습니다. CSS (js 및 jquery도 환영합니다)를 사용하여이 작업을 수행 할 수있는 아이디어는 무엇입니까?

Answer 1

아래 내용은 어떻습니까?

스크롤 가능한 내용에 대해 두 개의 div를 포함하고 바닥 글에 대해 두 개의 div를 보유하는 컨테이너를 만듭니 다. 모든 높이를 고치고 내용 div 스크롤 가능하게하십시오.

CSS (내 전문가 색상 선택에 대한 비용이 청구되지 않습니다) : HTML의

#dialog-window { 
    height: 200px; 
    border: 1px black solid; 
} 

#scrollable-content { 
    height: 180px; 
    overflow: auto; 
    background-color: blue; 
} 

#footer { 
    height: 20px; 
    background-color: green; 
} 

예를

<div id="dialog-window"> 

    <div id="scrollable-content"> 
    <ul> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
     <li>Sample</li> 
    </ul> 
    </div> 

    <div id="footer"> 
    </div> 

</div>