Using <a> tag or <button> tag for dropdown menues | bootstrap

user_3010171 0
Viewed 671

We're using bootstrap in our project, and when we use dropdown we are asked to change our menu items from <a href="#" .. to <button> instead. Even tho the documentation for bootstraps use <a href ..

https://getbootstrap.com/docs/4.0/components/dropdowns/

I've asked the UX designer, and it has some issues with focus tabbing, like. when you tab through elements.

Is there any other compelling reason to use <button> over <a href="# ..

bootstrap-4 html
1 Answers

You can easily use buttons in a dropdown, too:

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <button class="dropdown-item">Action</button>
    <button class="dropdown-item">Another action</button>
    <button class="dropdown-item">Something else here</button>
  </div>
</div>

Working example: https://www.bootply.com/NTH6FzGx4A

user_72255240
Related