ドロップダウンメニューをスクロール可能にするにはどうすればいいですか？

Question

私はドロップダウンメニューを持っています。ドロップダウンには現在8つのリンクが表示されます。私は21のリンクを入れたいと思っているが、これは全画面を占めるだろう。スクロール可能なポップアップを作成するにはどうしたらいいですか？ここで

8つのリンクを持つ現在、私のポップアップされます。

<a href="specifying.html"> 
    <div class="col-sm-3" id="about-tab"> 
    <li class="dropdown"> 
     <a href="#" class="dropdown-toggle" data-toggle="dropdown">Specifying</a> 
     <ul class="dropdown-menu" role="menu"> 
     <li><a href="x-ray.html">X-Ray</a> 
     </li> 
     <li><a href="#">S/Opening Calculator</a> 
     </li> 
     <li><a href="certification.html">Certification</a> 
     </li> 
     <li><a href="door-cores.html">Door Cores</a> 
     </li> 
     <li><a href="frame-types-and-materials.html">Frame Types & Materials</a> 
     </li> 
     <li><a href="downloads.html">Downloads</a> 
     </li> 
     <li><a href="pas24-secure-by-design.html">PAS 24/Secure By Design</a> 
     </li> 
     <li><a href="#">Pre-Hanging</a> 
     </li> 
     </ul> 
    </li> 
    </div> 
</a> 

Answer 1

はこれを試してみてください。これにより、ドロップダウンメニューの高さが制限され、オーバーフローがスクロールで表示されます。

.dropdown-menu { 
    max-height:200px; 
    overflow:scroll; 
}