1. ホーム
  2. html

[解決済み] 固定要素の内容がビューポートの高さを超えたときだけスクロールできるようにするにはどうしたらいいですか?

2022-09-22 08:28:09

質問

私は div 配置された fixed は、ウェブページの左側に配置され、メニューとナビゲーションのリンクを含んでいます。これは、CSSから高さが設定されておらず、コンテンツが高さを決定し、幅は固定されています。問題は、コンテンツが多すぎる場合に div がウィンドウの高さより大きくなってしまい、コンテンツの一部が見えなくなってしまうことです。(ウィンドウをスクロールさせても、位置が fixed であり div はスクロールしない)

を設定しようとしたのですが overflow-y:auto; を設定してみましたが、これも役に立ちません。divは、その一部がウィンドウの外にあることに気づいていないようです。

の場合、必要なときだけ内容をスクロールできるようにするにはどうしたらよいでしょうか。 div がウィンドウからはみ出した場合、必要なときだけ内容をスクロールできるようにするにはどうしたらよいでしょうか。

どのように解決するには?

おそらく無理でしょう。ここに近いものがあります。下にスペースがあると、その周りにコンテンツが流れない。

http://jsfiddle.net/ThnLk/1289

.stuck {
    position: fixed;
    top: 10px;
    left: 10px;
    bottom: 10px;
    width: 180px;
    overflow-y: scroll;
}

高さをパーセントで指定することもできます。

http://jsfiddle.net/ThnLk/1287/

.stuck {
    max-height: 100%;
}