Dropdown Menus

Dropdown menus allow users to take an action by selecting from a list of choices revealed upon opening a temporary, new sheet of material.

Material uses Bootstrap's dropdown, please visit Bootstrap's documentation site for detailed usage.

Examples

Toggle dropdown menus by clicking the links below.

In addition, clicking on the user avatar in the top right hand corner of the page can also trigger a dropdown menu.

<li class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown"> ... </a>
    <ul class="dropdown-menu">
        <li>
            <a> ... </a>
        </li>
    </ul>
</li>
<div class="dropdown-wrap">
    <div class="dropdown dropdown-inline">
        <a class="btn dropdown-toggle-btn" data-toggle="dropdown"> ... </a>
        <ul class="dropdown-menu nav">
            <li>
                <a> ... </a>
            </li>
        </ul>
    </div>
</div>
Linksappsclose