Hopiu/bootstrap
1
0
Fork 0
mirror of https://github.com/Hopiu/bootstrap.git synced 2026-03-18 21:40:24 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
bootstrap/docs/components/button-dropdown.md
Mark Otto f6ad665c26 Switch up some split button stuff 
- New vars
- New function for stripping units so we can combine rems and ems in math functions
- Add new classes for sizing and spacing around the split dropdown toggle so that the caret isn't misaligned
2016-01-08 13:23:24 -08:00

14 KiB
Raw Blame History

layout title group
docs Button dropdown components

Use any button to trigger a dropdown menu by placing it within a .btn-group and providing the proper dropdown menu markup.

{% callout danger %}

Plugin dependency

Button dropdowns require the [dropdown plugin]({{ site.baseurl }}/components/dropdowns/) to be included in your version of Bootstrap. {% endcallout %}

Contents

  • Will be replaced with the ToC, excluding the "Contents" header {:toc}

Single button dropdowns

Turn a button into a dropdown toggle with some basic markup changes.

{% highlight html %}

{% endhighlight %}

Split button dropdowns

Similarly, create split button dropdowns with nearly the same markup as single button dropdowns, but add the .dropdown-toggle-split class for proper spacing around the dropdown caret.

{% highlight html %}

{% endhighlight %}

Sizing

Button dropdowns work with buttons of all sizes.

{% highlight html %}

...
...
{% endhighlight %}

Dropup variation

Trigger dropdown menus above elements by adding .dropup to the parent.

{% highlight html %}

{% endhighlight %}