4 ms·
It's because all the font sizes in the page are relative to: html {font-size: calc(0.5vw + 1rem)} In other words, the (user configurable) browser default s
by GrantMoyer 2y ago
It's because all the font sizes in the page are relative to:
html {font-size: calc(0.5vw + 1rem)}
In other words, the (user configurable) browser default size plus 0.5% of the viewport width, which is kind of insane. One (intended?) side effect is that the font size grows and shrinks as you resize the browser window horizontally.
- cantSpellSober 2y agoYes, viewport units (like vw) don't always respect user settings, such as zoom levels or custom font sizes. It seems like a good idea at first (larger viewport? larger text!) but not a recommended practice.
- velcrovan 2y agoThere's a better way to do this: html { font-size: clamp(16px, 2vw, 20px); } Pick a reasonable minimum and maximum, and between them a calculated value that scales with viewport width. (You can see this in action in the sites in my bio.)