1

JSP に 2 つの DIV が並んでいます。うまく機能しますが、1 つの例外があります。jQuery Dynatree で左側の DIV の水平方向のスペースを適切に埋めることができません。

ここに画像の説明を入力

ここに画像の説明を入力

HTMLは次のとおりです。

<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>

および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 も使用します。何が問題なのですか？助けてくれてありがとう！

4

1 に答える 1

2

#tree幅は 250px に設定されています。

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

に設定した場合100%(または width プロパティを完全に削除した場合)、コンテナー ( #sub-left) がいっぱいになります。

#sub-leftこれは、250px が使用可能なサイズの 24% よりも大きくなるため、ウィンドウを縮小したときにコンテナーからはみ出す理由でもあります (2 番目の画像)。

于 2012-01-19T14:17:06.150 に答える