From f10ac7c65e7d2342e2add599b4889d33ed9df6a2 Mon Sep 17 00:00:00 2001 From: tinayuangao Date: Wed, 26 Oct 2016 11:43:23 -0700 Subject: [PATCH] fix(button): set vertical alignment for md-button and md-raised-button (#1565) * Set vertical alignment for md-button and md-raised-button so md-icon inside is correctly aligned --- src/demo-app/button/button-demo.html | 12 ++++++++++++ src/lib/button/button.scss | 7 +++++++ 2 files changed, 19 insertions(+) diff --git a/src/demo-app/button/button-demo.html b/src/demo-app/button/button-demo.html index e8d9b17ae78e..5fb68da3df3c 100644 --- a/src/demo-app/button/button-demo.html +++ b/src/demo-app/button/button-demo.html @@ -89,4 +89,16 @@ SEARCH +
+ + + + +
+
+ + + + +
diff --git a/src/lib/button/button.scss b/src/lib/button/button.scss index 5f1a78b4755c..6ac83e421285 100644 --- a/src/lib/button/button.scss +++ b/src/lib/button/button.scss @@ -47,6 +47,13 @@ } } +// The text and icon should be vertical aligned inside a button +[md-button], [md-raised-button] { + .md-button-wrapper > * { + vertical-align: middle; + } +} + // The ripple container should match the bounds of the entire button. .md-button-ripple { position: absolute;