Components: Input container / form field font size does not adhere to material design spec
The size is set to inherit, but the spec requires size 16. Inherit is wrong.
gtranter
All 5 comments
Apparently this was addressed by #5154 / #5262 but not fully fixed (the root cause was addressed but not the root problem - font size).
gtranter
on 15 Aug 2017
aha... so this is probably why md-selects are sized 16px and form field text inputs are... whatever sized
michahell
on 16 Aug 2017
We intentionally make the input more flexible than the spec calls for (allowing the input to use its inherited font-size).
jelbourn
on 16 Aug 2017
Why? I don't understand why it needs to be "more flexible." I can easily override the style if I want flexibility. I'd love to know the reasoning behind that for my own education. Do you do this with any other components? Disappointing that in some cases the spec is adhered to with great rigidity and no consideration for "flexibility" whereas here it is considered unimportant.
I though this would be an obvious one but I guess I was wrong. I suspect this is an ad-hoc arbitrary decision that no-one really thought through, so let me state the case a little more clearly. This is less flexible because now I have to override the style if I happen to have my input in a P or DIV with .mat-typography applied - which is generally always. I apply .mat-typography at the root of my page which is what Angular Material recommends (I love this feature). So every input in every DIV or P now has font size 13 with (as a result) a barely visibly 9.75px label and hint. (You should try this and see how bad it looks.) And there is no class defined so that I can easily say <md-input-container class="mat-input-typography"> or similar to have it at spec size - because you made .mat-input font-size inherit. Please, for the love of bacon, explain to me how this is more "flexible???"
gtranter
on 17 Aug 2017
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
_This action has been performed automatically by a bot._
![angular-automatic-lock-bot[bot] picture](https://avatars.githubusercontent.com/in/40213?v=4&s=40)
angular-automatic-lock-bot[bot]
on 7 Sep 2019
Related issues
michaelb-01
路
3Comments
jelbourn
路
3Comments
crutchcorn
路
3Comments
vanor89
路
3Comments
savaryt
路
3Comments
Most helpful comment
Why? I don't understand why it needs to be "more flexible." I can easily override the style if I want flexibility. I'd love to know the reasoning behind that for my own education. Do you do this with any other components? Disappointing that in some cases the spec is adhered to with great rigidity and no consideration for "flexibility" whereas here it is considered unimportant.
I though this would be an obvious one but I guess I was wrong. I suspect this is an ad-hoc arbitrary decision that no-one really thought through, so let me state the case a little more clearly. This is less flexible because now I have to override the style if I happen to have my input in a P or DIV with .mat-typography applied - which is generally always. I apply .mat-typography at the root of my page which is what Angular Material recommends (I love this feature). So every input in every DIV or P now has font size 13 with (as a result) a barely visibly 9.75px label and hint. (You should try this and see how bad it looks.) And there is no class defined so that I can easily say <md-input-container class="mat-input-typography"> or similar to have it at spec size - because you made .mat-input font-size inherit. Please, for the love of bacon, explain to me how this is more "flexible???"