From 0b0a77b3a7d09287e090a5d6c476ae2d487c9b40 Mon Sep 17 00:00:00 2001
From: CJ Cenizal <cj@cenizal.com>
Date: Fri, 16 Dec 2016 15:57:36 -0800
Subject: [PATCH] Set Button component to display: inline-block, to ensure it
 has the same height when applied to both button elements and anchor tags.
 (#9541)

---
 src/ui_framework/components/button/_button.scss            | 7 +++++--
 .../doc_site/src/views/button/button_elements.html         | 4 ----
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/ui_framework/components/button/_button.scss b/src/ui_framework/components/button/_button.scss
index e342507efbdce..e284d5dd6ee66 100644
--- a/src/ui_framework/components/button/_button.scss
+++ b/src/ui_framework/components/button/_button.scss
@@ -1,7 +1,10 @@
 /**
- * 1. Disable for Angular.
+ * 1. Setting to inline-block guarantees the same height when applied to both
+ *    button elements and anchor tags.
+ * 2. Disable for Angular.
  */
 .kuiButton {
+  display: inline-block; /* 1 */
   appearance: none;
   padding: 4px 12px 5px;
   font-size: $fontSize;
@@ -14,7 +17,7 @@
 
   &:disabled {
     cursor: default;
-    pointer-events: none; // 1
+    pointer-events: none; /* 2 */
   }
 
   &:active:enabled {
diff --git a/src/ui_framework/doc_site/src/views/button/button_elements.html b/src/ui_framework/doc_site/src/views/button/button_elements.html
index da1082177c5c9..7bb5de327e8d9 100644
--- a/src/ui_framework/doc_site/src/views/button/button_elements.html
+++ b/src/ui_framework/doc_site/src/views/button/button_elements.html
@@ -2,16 +2,12 @@
   Button element
 </button>
 
-<hr class="guideBreak">
-
 <input
   type="submit"
   class="kuiButton kuiButton--basic"
   value="Submit input element"
 >
 
-<hr class="guideBreak">
-
 <a href="#" class="kuiButton kuiButton--basic">
   Anchor element
 </a>