Bootstrap 5 is in alpha when this is written and it’s subject to change.

Bootstrap is a popular UI library for any JavaScript apps.

In this article, we’ll look at how to manipulate dropdowns with JavaScript and add content with Bootstrap 5.

Text

We can add any text to a dropdown menu.

For instance, we can write:

<div class="btn-group">
  <button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" data-display="static">
    button
  </button>
  <div class="dropdown-menu p-4 text-muted">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non libero congue lectus pharetra dictum quis ut eros. Nunc ac eleifend risus. In vitae arcu tincidunt, eleifend velit id, cursus nibh. Vestibulum hendrerit urna dictum, vulputate quam et, faucibus sapien. Suspendisse in mauris non diam facilisis aliquet eget ac nisi. Donec nec elit vel ex pellentesque pellentesque. Sed commodo tellus at enim vulputate ornare. Pellentesque vel elit ut libero hendrerit dictum a in dolor. Suspendisse cursus justo nulla, ac malesuada orci pretium quis. Sed sed nunc in lacus hendrerit consequat.
  </div>
</div>

to add text with some padding into our dropdown menu.

#javascript #web-development #bootstrap #developer

How to Manipulate Dropdowns with JavaScript and Bootstrap 5
2.20 GEEK