divの高さがコンテナのdivの高さに合わせて自動スクロール

Question

ページのCSSスタイルに問題があります。 基本的に私は2つの列でコンテンツを整理したいというダイアログとして使用されるdivを持っています。最初の要素は長い要素リストを含み、スクロール可能でなければならず、2番目の要素は小さくなければなりません。固定された位置にある。だから、私はすべてのダイアログコンテンツをcrawableにするのではなく、その半分だけを望んでいます。 は、私はあなたには、いくつかの試みを行う必要がある場合の例here on jsfiddle toghether入れ...コードは次のとおりです。

CSS

#container { 
border: 1px solid black; 
height: 200px; 
} 
#main { 
    display: table; 
    border: 1px dashed blue; 
    height: 200px; 
} 
#row{ 
    display: table-row; 
    height: 200px; 
} 
#leftPanel{ 
    display: table-cell; 
    width: 50%; 
    height: 200px; 
    overflow: auto; 
    border: 1px dotted red; 
} 
#rightPanel{ 
    display: table-cell; 
    width: 50%; 
    vertical-align: top; 
    height: 200px; 
} 

HTML

<div id="container"> 
    <div id="main"> 
     <div id="row"> 
      <div id="leftPanel"> <!-- This one should be scrollable --> 
       <!-- Long list of element here--> 
      </div> 
      <div id="rightPanel"> 
       <div style="height: 50px;"> 
        Something here 
       </div> 
       <div style="height: 50px;"> 
        Something else here 
       </div> 
      </div> 
     </div> 
    </div> 
</div>​​​​​​​​​​​​​​​​​​​ 

がどのようにスクロールするleftPanelを得ることができます？ 私はCSSテーブルのすべてのコンポーネントの固定された高さを設定しようとしましたが、何の結果もありませんでした。何が間違っていますか？このよう

Answer 1

：あなたはそれがより難しいかもしれない変数高さのいくつかの種類であることを左の列の高さが必要な場合http://jsfiddle.net/Zw8WK/10/

は今overflow-y: scrollまたは交互overflow : scroll

を使用して、ここで私はそれを設定しています親コンテナの高さ