ナビゲーションのメニューをスクロールさせたい。

Question

前提・実現したいこと

bootstrap4
ナビゲーションバーをオープンにしたときにスクロールをできるようにしたい。

該当のソースコード

<header class="fixed-top bg-white border-bottom">
     <div class="container-fluid">
     <div class="row">
        <nav class="navbar navbar-light navbar-expand-md">
        <button class="navbar-toggler" data-toggle="collapse" data-target="#Content">
          <span class="navbar-toggler-icon"></span>
        </button>


        <div id="Content" class="collapse navbar-collapse">
         <ul class="navbar-nav flex-column">
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
          <li class="nav-item"><a class="nav-link" href="">a</a></li>
          <li class="nav-item"><a class="nav-link" href="/">a</a></li>
         </ul>
        </div>
        
        </nav>

...

以下の仕様のscrollをclassに記述したが動かなかった。

.scroll{overflow-y:auto; top:0; left:0; right:0; bottom:0; padding-bottom: 80px; -ms-overflow-style: none;}

Answer 1

height:autoだからじゃないですか？

.scroll{overflow-y:auto; top:0; left:0; right:0; bottom:0; padding-bottom: 80px; -ms-overflow-style: none; height:calc( 100vh - 1.5rem )}

Comments

[dato]

ありがとうございます！