Dropdowns

Dropdowns are used as menus or shortcuts.

Standard dropdown:

Dropdown menu aligning left.

<div class="dropdown">
    <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Dropdown toggle</button>
    <ul class="dropdown-menu">
        <li><a href="#"><i class="fas fa-edit"></i> Edit rule</a></li>
        <li><a href="#"><i class="fas fa-trash"></i> Delete rule</a></li>
    </ul>
</div>

If using in the right side of the screen, add dropdown-menu-right:

 <div class="dropdown">
    <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Dropdown toggle (right)</button>
    <ul class="dropdown-menu dropdown-menu-right">
        <li><a href="#"><i class="fas fa-edit"></i> Edit rule</a></li>
        <li><a href="#"><i class="fas fa-trash"></i> Delete rule</a></li>
    </ul>
</div>

Dropdown menu aligning right.