2011-09-15 8 views
0

私はコンテンツdivとサイドバーを持っていますが、コンテンツdivの高さはロードされるコンテンツに応じて調整されますが、コンテンツの最大サイズに応じて、サイドバーは同じサイズにする必要があります。浮動小数点型メニューを拡張するので、高さがコンテンツdivと一致しています

Fiddle, Fiddle, Fiddle! - JS Fiddle

ビュー上記のフィドルは、私はサイドバーには、コンテンツのdivの高さに応じて、ダウンすべての方法を拡張します。あなたはそのためにJavaScriptを使用する必要があります
CSS

#content 
{ 
border:1px solid black; 
float: left; 
width: 80%; 
} 

#sidebar 
{ 
width: 19%; 
border:1px solid red; 
float: left; 
background-color: #ddd; 
} 

p{text-align: right} 

HTML

<div id="container" style="background-color: #f2f2f2"> 
<div id="content">Here is the content, the height of this div will vary depending on the content. 
    <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> 
    <p>I dont want this big empty box. --> <br/>I want the sidebar extended down here--></p> 
</div> 
<div id="sidebar">I want this sidebar to extend ALL the way down, to match the #content divs height (whatever it is, dynamic)</div> 
<div style="clear:both"></div> 

答えて

3

:非バイオリン弾きのために

。 Jqueryではそれは次のようなものです。

$('#sidebar').height($('#content').height()); 

フィドルhttp://jsfiddle.net/YMFGU/9/