css-library: Fixing the html element's font-size so it will respect browser settings #1444
Conversation
| @@ -11,7 +11,7 @@ body { | |||
| } | |||
|
|
|||
| html { | |||
| font-size: $em-base; | |||
| font-size: 100%; // Needs to be 100% to be able to grow and shrink with browser settings | |||
There was a problem hiding this comment.
This was changed to 16px because of root font size updates related to USWDS v3 (it previously being 10px). Was this tested using Verdaccio to make sure everything still looks correct by default?
There was a problem hiding this comment.
I agree here with Jami. If this hasn't been tested with Verdaccio, then it needs to be. The entire typography change initiative we completed last summer was centered around this.
There was a problem hiding this comment.
@Andrew565 I was thinking about this more and think the 100% font-size will still work because the default font-size for most browsers should already be 16px without us needing to do anything special. That 100% value would then be based on that default. A base value of 1rem might have the same effect too. A sanity check with Verdaccio or a release candidate would ease our minds though.
There was a problem hiding this comment.
Working on testing this with Verdaccio.
There was a problem hiding this comment.
Looks good with Verdaccio. Seen here is the "Very Large" font setting. The normal/medium font setting looks the same as it always does.
Chromatic
https://3646-fix-browser-font-sizing--65a6e2ed2314f7b8f98609d8.chromatic.com
Description
Closes #3646
QA Checklist
N/A
Screenshots
N/A
Acceptance criteria
Definition of done