fix(menu): incorrect text alignment in IE/Edge

Fixes the text being centered in menu items on IE and Edge. It was due to the fact that they don't support `text-align: start/end`. Fixes angular#3254.
crisbeto · Feb 23, 2017 · 5866df7 · 5866df7
1 parent a4da08b
commit 5866df7
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/src/lib/core/style/_menu-common.scss b/src/lib/core/style/_menu-common.scss
@@ -32,13 +32,17 @@ $mat-menu-side-padding: 16px !default;
 
   font-size: $mat-menu-font-size;
   font-family: $mat-font-family;
-  text-align: start;
+  text-align: left;
   text-decoration: none;   // necessary to reset anchor tags
 
   &[disabled] {
     cursor: default;
   }
 
+  [dir='rtl'] & {
+    text-align: right;
+  }
+
   .mat-icon {
     margin-right: 16px;