Open patrickrodee opened 5 years ago
rem
doesn't solve the use case of having 2 text fields on the same page be different sizes (ex: an email
subject vs cc line, or a calendar invite title vs location fields).
By basing it on em
it still respects the scale applied to rem
but allows for more granular control. I recommend we use em
and have users specify the specific font-size on the mdc-text-field
element or parent directly.
When trying to fix this exact same issue in AngularJS Material, the solution was to use 1em
for the font-size
of the input element.
But unfortunately, our fix came along way too late in the framework lifecycle so, ultimately, we couldn't risk breaking design layouts. I suggest adding this sooner than later.
The other question you'll have is, if you resize the input label from 16sp, is the label meant to be 12sp or 75% of the input label? I haven't been able to find an answer for that. MD2015 changed all samples to use 16sp instead of varying height. It used to look like this, showing to use 12sp no matter what size the input was. But with the newer redesign, there are no such samples selectively showing large font. It was changed to this.
That's something you'd have to either take a guess at, or ask for some explicit direction from the Googlers.
Since we changed font-size to rem
can we close this now?
Google internally needs
rem
overpx
for sizing of text field content to solve for accessible scaling.An example working codepen has already been created: https://codepen.io/williamernest/pen/bmOKeQ
Related to #2731, #4142