爲什麼不dispay滾動條在兒童的div

-2

<body> 
 
\t <div id="parentid" style="position:absolute;width:20%;height:100%;"> 
 
\t \t <div id="inputdiv"> 
 
\t \t \t <span >hight:</span> 
 
\t \t \t <input type="text" id="highlightinput"> 
 
\t \t </div> 
 
\t \t <div id="pollutanttree" style="height:2000px;overflow:auto;"> 
 
\t \t \t test data; 
 
\t \t </div> 
 
\t </div> 
 
\t <div style="position:absolute;left:20%;top:0px;height:100%;width:80%"> 
 
      right data; 
 
\t </div> 
 
</body>

我想在顯示頁面的右側pollutanttree div'right.but雙擊自動滾屏條顯示滾動條。

如果我將「overflow：auto」從污染源div樣式移動到parentid div樣式，這幾乎是正確的：但我不希望輸入div捲動在一起。

我該如何解決？

來源

2016-11-29 fe263

請註明你想要什麼。你的解釋很不清楚。 – Swapna

<div id="parentid" style="position:absolute;width:20%;height:100%;"> 
    <div style="height: 32px;line-height: 32px;"> 
     <span >hight:</span> 
     <input type="text" id="highlightinput"> 
    </div> 
    <div id="pollutanttree" style="position: absolute;top: 32px;left: 0;right: 0;bottom: 0;overflow:auto;"> 
     <div style="height: 2000px;"> 
      test data; 
     </div> 
    </div> 
</div>

errrrr，這是你想要的嗎？

來源

2016-11-29 09:36:55 PraefectZ

試試這個：希望它的工作

<div id="parentid" style="position:absolute;width:20%;height:100%;"> 
 
    <div style="height: 32px;line-height: 32px;"> 
 
     <span >hight:</span> 
 
     <input type="text" id="highlightinput"> 
 
    </div> 
 
    <div id="pollutanttree" style="position: absolute;top: 32px;left: 0;right: 0;bottom: 0;overflow:auto;"> 
 
     <div style="height: 2000px;"> 
 
      test data; 
 
     </div> 
 
    </div> 
 
</div>

來源

2016-11-29 10:01:03

thanks.can我不依賴於固定的高度和頂部位置？因爲div的輸入類會改變：btn-group-lg/btn-group-sm，等等...... – fe263

沒有不幸，我想不是 –

目前，你給2000像素高度#pollutanttree這使得滾動條對人體具有它在做什麼。你必須降低#pollutanttree的高度，並在這之間推進數據。見下面的代碼。

<body> 
    <div id="parentid" style="position:absolute;width:20%;height:100%;"> 
     <div> 
      <span>hight:</span> 
      <input type="text" id="highlightinput"> 
     </div> 
     <div id="pollutanttree" style="height:200px;overflow:auto;"> 
      test data test datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest datatest data; 
     </div> 
    </div> 
    <div style="position:absolute;left:20%;top:0px;height:100%;width:80%"> 
      right data; 
    </div> 
<div class="as-console-wrapper"><div class="as-console"></div></div> 
</body>

來源

2016-11-29 10:25:55

<body> 
 

 
\t <div id="parentid" style="position:absolute;width:20%;height:100%;"> 
 
\t \t <div id="inputdiv"> 
 
\t \t \t <span >hight:</span> 
 
\t \t \t <input type="text" id="highlightinput"> 
 
\t \t </div> 
 
\t \t <div id="pollutanttree" style="height:2000px;overflow:auto;"> 
 
\t \t \t test data; 
 
\t \t </div> 
 
\t </div> 
 
\t <div style="position:absolute;left:20%;top:0px;height:100%;width:80%"> 
 

 
      right data; 
 

 
\t </div> 
 

 

 
</body>

來源

2016-11-29 11:04:49

試試這個代碼筆.. 你的答案codepen

其實你給height: 2000px和overflow: auto，但沒有那麼多的內容在該元素，基本上，當卷軸到來時意味着超過你的身高。希望你能理解。

來源

2016-11-29 11:08:41

這樣的事情？

<body> 
 

 
\t <div id="parentid" style="position:absolute;width:20%;height:100%;"> 
 
\t \t <div id="inputdiv"> 
 
\t \t \t <span >hight:</span> 
 
\t \t \t <input type="text" id="highlightinput"> 
 
\t \t </div> 
 
\t \t <div id="pollutanttree" style="height:2000px;overflow-y:scroll;"> 
 
\t \t \t test data; 
 
\t \t </div> 
 
\t </div> 
 
\t <div style="position:absolute;left:20%;top:0px;height:100%;width:80%"> 
 

 
      right data; 
 

 
\t </div> 
 

 

 
</body>

來源

2016-11-29 12:05:24 codexy

爲什麼不dispay滾動條在兒童的div

回答

相關問題