1

私が欲しいもの： 

   <div style="overflow:scroll;width:100%;height:50%;"> &nbsp;
    <div style="height:500px;width:400px;border:solid 3px red;">
        </div>
        </div>

<div style="overflow:scroll;width:100%;HEIGHT:50%;"> &nbsp;
    <div style="height:500px;width:400px;border:solid 3px red;">
        </div>
        </div>

ウィンドウの高さを縮小すると、スクロールバーが縮小することに注意してください。これが私が欲しい機能です。

問題：
上記のようなものを作成したいのですが、上部のdivの高さが100ピクセルに固定されているだけです。

実際にこれを行うと、ページを縮小しても下部のスクロールバーが縮小しなくなります。システムは両方のセクションを管理するために外側のスクロールバーを追加します。これは必要ありません。上記の動作を維持したいと思います。

どうすればよいですか？

4

2 に答える 2

0

私があなたを正しく理解しているかどうかは完全にはわかりませんが、相対値とピクセル値を組み合わせようとしているように見えますが、うまくいきません。

これが私がこれを行う唯一の方法です。要素を絶対に配置します。

  <div style="position: absolute; 
              left: 0px; top: 0px; height: 100px; 
              overflow:scroll;right: 0px;">
    &nbsp;
    <div style="height:500px;width:400px;border:solid 3px red;">
        </div>
        </div>

<div style="position: absolute; 
            left: 0px; top: 100px; 
            bottom: 0px; right: 0px; 
            overflow:scroll;"> 
    &nbsp;
    <div style="height:500px;width:400px;border:solid 3px red;">
        </div>
        </div>
于 2010-03-15T21:34:12.543 に答える
0

私は答えを見つけました。CSS 式を使用する必要がある

       <div style="overflow:scroll;width:100%;height:100px"> &nbsp;
    <div style="height:500px;width:400px;border:solid 3px red;">
        </div>
        </div>

<div style="overflow:scroll;width:100%;height:expression((document.body.clientHeight - 120) + 'px');"> &nbsp;
    <div style="height:500px;width:400px;border:solid 3px red;">
        </div>
        </div>
于 2010-03-16T20:19:53.973 に答える