Bootstrap 5 dropdown

1. How to give dropdown in Bootstrap 5?
2. Why dropdown is not working in Bootstrap 5?
3. How to change dropdown icon in Bootstrap 5?
4. How to remove dropdown arrow in Bootstrap 5?

How to give dropdown in Bootstrap 5?

To open the dropdown menu, use a button or a link with a class of .dropdown-toggle and the data-bs-toggle="dropdown" attribute. Add the .dropdown-menu class to a <div> element to actually build the dropdown menu. Then add the .dropdown-item class to each element (links or buttons) inside the dropdown menu.

Why dropdown is not working in Bootstrap 5?

Solution : The dropdown should be toggled via data attributes or using javascript. In the above program, we have forgotten to add a data attribute so the dropdown is not working. So add data-bs-toggle="dropdown" to toggle the dropdown.

How to change dropdown icon in Bootstrap 5?

Use dropdown, add . hidden-arrow class next to . dropdown-toggle and change text into icon in <button> element. If You want an icon in the dropdown, just add the icon next to the text in <li> element.

How to remove dropdown arrow in Bootstrap 5?

Every Bootstrap dropdown button or link has an ::after selector in CSS. ::after selector is often used to insert some text after the content of the element. In this case, the content is a dropdown arrow. To remove it, just make the content go 'none'.