Dropdown

A dropdown that allows you to view the list

Normal Dropdown


<div class="dropdown">
  <button class="btn dropdown-toggle">Down</button>
  <div class="dropdown-menu bg-white">
    <a href="" class="dropdown-item text-text">Foo</a>
    <a href="" class="dropdown-item text-text">Bar</a>
  </div>
</div>
            

Border menu


<div class="dropdown">
  <button class="btn dropdown-toggle">Down</button>
  <div class="dropdown-menu bg-white border">
    <a href="" class="dropdown-item text-text">Foo</a>
    <a href="" class="dropdown-item text-text">Bar</a>
  </div>
</div>
            

Hover to be active

This method is best for mobile.



<div class="dropdown hover-active">
  <button class="btn dropdown-toggle">Down</button>
  <div class="dropdown-menu bg-white">
    <a href="" class="dropdown-item text-text">Foo</a>
    <a href="" class="dropdown-item text-text">Bar</a>
  </div>
</div>
            

Active

This method is best for clicking to view.
Please use JavaScript.





<div class="dropdown active">
  <button class="btn dropdown-toggle">Down</button>
  <div class="dropdown-menu bg-white">
    <a href="" class="dropdown-item text-text">Foo</a>
    <a href="" class="dropdown-item text-text">Bar</a>
  </div>
</div>