Dropdown

Add a dropdown list to any button. Make sure that the data-target attribute matches the id in the <ul> tag. You can add a divider with the <li class="divider"></li> tag. Children can be either <button class="dropdown-item" />, or <a class="dropdown-item" /> elements. You can also add icons. Just add the icon inside the anchor tag.

  
  
<div class="dropdown">
  <button
    type="button"
    class="btn btn-primary"
    id="dropdown1"
    data-mdb-toggle="dropdown"
    aria-expanded="false"
  >
    Drop Me!
  </button>
  <!-- Dropdown Structure -->
  <ul aria-labelledby="dropdown1" class="dropdown-menu">
    <button type="button" class="dropdown-item" href="#!">button</button>
    <li><a class="dropdown-item" href="#!">two</a></li>
    <li class="divider" tabindex="-1"></li>
    <li><a class="dropdown-item" href="#!">three</a></li>
    <li>
      <a class="dropdown-item" href="#!"
        ><span class="material-icons">view_module</span>four</a>
    </li>
    <li>
      <a class="dropdown-item" href="#!">
        <span class="material-icons">cloud</span>five</a>
    </li>
  </ul>
</div>