Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make a scrollable dropdown menu in bootstrap 5? [duplicate]

I've seen some great code examples for dropdown menus you can scroll through but sadly most don't work with bootstrap 5. Is there any modern way to do this?

like image 445
Andre Pells Avatar asked Aug 31 '25 04:08

Andre Pells


1 Answers

Do you mean a fixed height for the menu?

HTML:

<div class="container">
  <div class="dropdown">
    <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Click on Me
    <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
    </ul>
  </div>
</div>

CSS:

.dropdown-menu {
  max-height: 100px;
  overflow-y: scroll;
}
like image 88
brice Avatar answered Sep 02 '25 20:09

brice