0

いくつかのhtml:

<div style="height: 300px">
  <div id="inner">
    <div id="title">
       ...
    </div>
    <div id="content">
       ....
    </div>
    <div>
       ..another div
    </div>
  </div>
</div>

内側の div の高さを親の div よりも大きくしないようにしたいのですが、それが大きい場合はコンテンツ div にスクロールが必要ですが、小さい場合はコンテンツと同じサイズにする必要があります。

内部の max_height=100% を設定しようとしましたが、コンテンツにスクロールを設定できません。jsなしでやりたい

UPD: メイン div の高さがわかりません (300px は定数ではありません)

UPD2: メイン div に「max-height: 100%」があるため、正確な値がわかりません

デモ: http://jsfiddle.net/kzfRk/7/

4

5 に答える 5

0

わかりませんが、スクロールバーが表示されない場合は、次のことを試してください。

#inner{overflow-y:scroll;}
于 2012-10-24T12:49:20.960 に答える
0

高さを設定してから、オーバーフローを使用してスクロールを制御します。

​#inner{max-height:100%;overflow-y:scroll;}​

例: http: //jsfiddle.net/calder12/drC3L/コンテンツが多すぎる場合は、内側のdivがスクロールするので、外側のdivのサイズを任意のサイズに変更します。

于 2012-10-24T12:49:56.420 に答える
0

これはあなたが考えていたものですか?(色は見やすくするためのものです)ここでライブを参照してください。

css

.container{
    height: 300px;
    overflow: hidden;
    border: 1px solid #000;
}
#inner{
    max-height:300px;
    overflow-y: auto; border: 1px solid #f00;
}
#title{ background-color: #eed;}
#content{background-color: #fee;}

html

<div class='container'>
  <div id="inner"> 
    <div id="title"> 
       ... 
    </div> 
    <div id="content"> 
        ....    
    </div>    
    <div>    
       ..another div    
    </div>    
  </div>    
</div> 
于 2012-10-24T13:13:43.923 に答える
0

内部 div の最大高さをルート div の高さと同じに設定する必要があります。フィドルを使用して、以下の CSS をコピーして CSS ファイルに貼り付けると、機能します...

.container{
    max-height: 100%;
    border: 1px solid #000;
}
.inner{
    max-height: 100px;
    overflow-y: auto; border: 1px solid #f00;
}
.root{
    height: 100px;
    border: 1px solid;
}
于 2014-02-01T01:07:15.017 に答える
0

ライブの例はありますか?自分がやろうとしていることを理解するのは難しい。

親 div を画面全体に表示し、コンテンツをスクロールさせたいですか? その場合は、親 div の高さを 100% にして、次のスタイルを内側の div に適用してみてください。

height:100%; min-height: 100%; overflow:auto;
于 2012-10-24T13:39:07.743 に答える