Resizing text with vh or vw

Tell us what’s happening:

Hi there, I have learned through someone else on this forum (I can’t remember who so I can’t tag them) that it’s a bad idea to use vw or vh for text because then the user can’t resize the text themselves in the browser.

Just wondering if this lesson needs to be revised, or if I’m misunderstanding something.

Challenge: Make Typography Responsive

Link to the challenge:

The lesson is more about introducing the units.

Re IRL usage, the reason it’s often a bad idea should be very clear if you just resize your browser. It doesn’t really work well because you can literally make the text impossible to read by just changing the size of the browser window. The lesson is just a dead simple example. You can use it IRL just fine if you are very careful: this normally involves using the CSS function calc to add a small number in vh units to something sized in rem/px/etc, but that’s a little beyond the scope of the course (for example
Fluid Typography | CSS-Tricks)

Thanks for the explanation. calc is one of those things I’ve seen but haven’t used.

Clamp (CSS-Tricks too) is more recent technique.

1 Like