CSS 나란히 - Dynatree가 가로로 채워지지 않습니다.

Question

JSP에 두 개의 side-by-side DIV가 있습니다. 그것은 하나 개의 예외와 함께 잘 작동합니다

<div id="sub-title"> 
    <div id="sub-left"> 
    <fieldset class="search-fields"> 
     <legend>Files Found</legend> 
     <!-- Add a <div> element where the tree should appear: --> 
     <div id="tree"> 
     </div> 
     </fieldset> 
    </div> 
    <div id="sub-right"> 
    <fieldset class="search-fields"> 
     <legend id="selectedFileLegend">Selected File Contents</legend> 
     <textarea name="fileContents" id="fileContents" rows="20" readonly="readonly" wrap='off'> 
(select via tree on left) 
     </textarea> 
    </fieldset> 
    </div> 
    <div class="clear-both"></div> 
</div> 

:

여기

는 HTML입니다 : 내가 제대로 좌측 DIV의 수평 공간을 채우기 위해 jQuery를 Dynatree를 얻을 수 없다 및 CSS :

#sub-left { 
/* background: #99FF99; pale green */ 
/* border:1px dashed; */ 
    float: left; 
    width: 24%; 
} 
#sub-right { 
/* background: #FFCC99; pale orange */ 
/* border:1px dashed; */ 
    float: right; 
    width: 73%; 
} 
#sub-title { 
    overflow:hidden; 
} 
.clear-both { 
    clear: both; 
} 

#tree { 
    vertical-align: top; 
    width: 250px; 
} 

나는 물론 dynatree CSS도 사용한다. 어떤 생각이 잘못된거야? 도와 주셔서 감사합니다!

Answer 1

#tree 너비는 250px로 설정됩니다.

당신이 100%로 설정 (또는 모두 폭 속성을 제거)하는 경우

#tree { 
    vertical-align: top; 
    width: 250px; 
} 

, 그것의 용기 (#sub-left)을 채울 것입니다.

이것은 250px가 사용 가능한 크기의 24 %보다 커지므로 창을 축소했을 때 #sub-left 컨테이너 밖으로 확장되는 이유이기도합니다 (두 번째 이미지).