From fe27f607b0f470364190306fcd9d8eeffbc73de5 Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Fri, 26 Mar 2021 21:59:18 +0100 Subject: [PATCH] fix(material-experimental/mdc-form-field): set explicit text-align Sets an explicit `text-align` on the MDC form field so that it isn't affected by the surrounding `text-align`. The issue can be seen by placing an MDC-based `mat-select` in a container with `text-align: cetner`. We have something similar in the existing form field already. --- src/material-experimental/mdc-form-field/form-field.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/material-experimental/mdc-form-field/form-field.scss b/src/material-experimental/mdc-form-field/form-field.scss index 0a7d842ab57f..7e0be3ee4377 100644 --- a/src/material-experimental/mdc-form-field/form-field.scss +++ b/src/material-experimental/mdc-form-field/form-field.scss @@ -37,6 +37,12 @@ flex-direction: column; // This allows the form-field to shrink down when used inside flex or grid layouts. min-width: 0; + // To avoid problems with text-align. + text-align: left; + + [dir='rtl'] & { + text-align: right; + } } // Container that contains the prefixes, infix and suffixes. These elements should