From 29b4031db5cdce170b817967e73f5fd5891a6545 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Mon, 17 Aug 2015 18:18:37 -0700
Subject: [PATCH] allow <button> elements as .dropdown-item's

---
 docs/components/dropdowns.md | 19 +++++++++++++++++++
 scss/_dropdown.scss          |  6 ++++++
 2 files changed, 25 insertions(+)

diff --git a/docs/components/dropdowns.md b/docs/components/dropdowns.md
index c60cb6fdbb..8b1ae7a67b 100644
--- a/docs/components/dropdowns.md
+++ b/docs/components/dropdowns.md
@@ -28,6 +28,25 @@ Wrap the dropdown's trigger and the dropdown menu within `.dropdown`, or another
 </div>
 {% endexample %}
 
+### Button elements
+
+You can optionaly use `<button>` elements in your dropdowns instead of `<a>`s.
+
+{% example html %}
+<div class="dropdown open">
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+    Dropdown
+  </button>
+  <div class="dropdown-menu" aria-labelledby="dropdownMenu1">
+    <button class="dropdown-item" type="button">Action</button>
+    <button class="dropdown-item" type="button">Another action</button>
+    <button class="dropdown-item" type="button">Something else here</button>
+  </div>
+</div>
+{% endexample %}
+
+
+
 ## Alignment
 
 By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add `.dropdown-menu-right` to a `.dropdown-menu` to right align the dropdown menu.
diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss
index 734efbb0b0..4ee6674e53 100644
--- a/scss/_dropdown.scss
+++ b/scss/_dropdown.scss
@@ -65,6 +65,12 @@
   color: $dropdown-link-color;
   white-space: nowrap; // prevent links from randomly breaking onto new lines
 
+  // For `<button>`s
+  text-align: inherit;
+  width: 100%;
+  background: none;
+  border: 0;
+
   @include hover-focus {
     color: $dropdown-link-hover-color;
     text-decoration: none;