fix(material/button): ensure svg icon is centered

Fixes that SVG icons sometimes weren't centered in an icon button. Fixes #26126.
angular · Dec 1, 2022 · 6a829ff · 6a829ff
1 parent 2e5fab6
commit 6a829ff
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/src/material/button/icon-button.scss b/src/material/button/icon-button.scss
@@ -45,6 +45,15 @@
     border-radius: 50%;
   }
 
+  // Ensures that the icons are centered.
+  .mat-icon {
+    text-align: center;
+
+    svg {
+      vertical-align: baseline;
+    }
+  }
+
   // MDC adds some styles to icon buttons that conflict with some of our focus indicator styles
   // and don't actually do anything. This undoes those conflicting styles.
   &.mat-unthemed,