DIV 같은 높이 JQuery와 또는 CSS

Question

나는이 자바 스크립트 코드가이 작동

$(document).ready(function() { 
    var leftHeight = $('#maincontent').height(); 
    $('#sidemenu').css({'height':leftHeight}); 
}); 

을하지만 매우 제한적이다. 내 #sidemenu가 확장되면 (예 : 하위 메뉴로 인해) div 내에 더 커집니다.

#sidemenu 나 #maincontent가 큰 경우 (높이가 증가), 서로를 따라갈 때마다 어떻게 할 수 있습니까?

CSS를 사용하여이 작업을 수행 할 수 있다면이 작업도 가능합니다.

감사합니다.

Answer 1

자바 스크립트를 잊어 버렸습니다.

#sidemenu을 #maincontent에 넣고 고정 폭을두고 왼쪽으로 띄우십시오. 그런 다음 #maincontent (#sidebar 아님)의 모든 내용을 #wrapper이라는 div에 넣으십시오 (말할 수 있음). #wrapper의 너비는 #maincontent 너비와 #sidemenu 너비의 너비를 뺀 값으로 지정합니다. 좋은 측정을 위해서 바로 전에 </div>이 #maincontent의 <br style="clear: both" />을 넣어.

이제 #maincontent (가 할 필요가있는 경우)를 sidemenu에 맞게 확장됩니다,하지만 #maincontent의 내용은 또한 자신의 래퍼 DIV 년으로, 그것의 너무 짧은 경우 #sidemenu 아래 포장하지 않습니다.

희망이 도움이되었습니다. 여기 갱신

는 예입니다 : 이것은 레이아웃의 경우

HTML

<div id="maincontent"> 
    <div id="sidemenu"> 
    <ul> 
     <li><a href="#asd">A Link</a></li> 
     <li><a href="#asd">A Link</a></li> 
     <li><a href="#asd">A Link</a></li> 
     <li><a href="#asd">A Link</a></li> 
     <li><a href="#asd">A Link</a></li> 
    </ul> 
    </div> 

    <div id="wrapper"> 
    This is where your text goes in the main content area of the site. 
    </div> 

    <br style="clear: both" /> 
</div> 

CSS

#maincontent { 
    width: 960px; 
} 

#sidemenu { 
    width: 330px; 
    float: left; 
} 

#wrapper { 
    width: 660px; 
    float: left; 
}