mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-23 10:04:04 +03:00
6.8 KiB
6.8 KiB
layout | title | group |
---|---|---|
docs | Menus | material-design |
Bootstrap users know these as [dropdowns]({{ site.baseurl }}/components/dropdowns/), but these are also known as menus in the Material Design specification.
Contents
- Will be replaced with the ToC, excluding the "Contents" header {:toc}
Styles
Icon with buttons
{% example html %}
more_vert
{% endexample %}
Action
Another action
Another action
Icon with links
{% example html %}
more_vert
{% endexample %}
Small fab
{% example html %}
more_vert
{% endexample %}
Action
Another action
Default fab
{% example html %}
more_vert
Action
Another action
{% endexample %}
Default button
{% example html %}
Dropdown
{% endexample %}
Alignment
Lower left side
{% example html %}
more_vert
{% endexample %}
Action
Another action
Disabled action
Separated link
Lower right side
dropdown
usage misaligned - see upstream Bootstrap issue #18552. Use btn-group
instead until issue is resolved (next example).
{% example html %}
more_vert
{% endexample %}
Action
Another action
Disabled action
Separated link
btn-group
usage works fine in this alignment.
{% example html %}
more_vert
{% endexample %}
Action
Another action
Disabled action
Separated link
Widths
Minimum width
{% example html %}
more_vert
{% endexample %}
A
B
Maximum width
{% example html %}
more_vert
{% endexample %}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut malesuada elit. Proin tristique, lorem eu vehicula congue, lectus ipsum porta quam, eget rutrum sapien turpis et libero.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut malesuada elit. Proin tristique, lorem eu vehicula congue, lectus ipsum porta quam, eget rutrum sapien turpis et libero.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut malesuada elit. Proin tristique, lorem eu vehicula congue, lectus ipsum porta quam, eget rutrum sapien turpis et libero.
Another action