# Dropdowns

Standard dropdown:

![Dropdown menu aligning left.](https://3101502904-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZdybBvJaAboIV6zNHC%2F-L_pvaRegw-j4tD-gyLf%2F-L_pvaxVmNhVhRds-SS6%2Fdropdown-left.PNG?generation=1552461755305624\&alt=media)

```markup
<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`:

```markup
 <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.](https://3101502904-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZdybBvJaAboIV6zNHC%2F-L_pvaRegw-j4tD-gyLf%2F-L_pvaxTNmkNVsa79nvq%2Fdropdown-right.PNG?generation=1552461755407153\&alt=media)