> For the complete documentation index, see [llms.txt](https://dev.xena.biz/xena-developer/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dev.xena.biz/xena-developer/user-interface/styleguide/dropdowns.md).

# Dropdowns

Standard dropdown:

![Dropdown menu aligning left.](/files/-L_pvaxVmNhVhRds-SS6)

```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.](/files/-L_pvaxTNmkNVsa79nvq)