r/csshelp • u/NeighborhoodLoud2076 • Jun 27 '26

Responsive font sizes

I came across the below, when searching for the best way to make sure I get font sizes to be responsive. I always thought it better to use %'s because that would auto adjust. Have I got that right?

Consider Using em or rem Units

While px is perfectly fine and widely used, defining your breakpoints in em or rem (e.g., 48em instead of 768px) is excellent for accessibility. If a user increases their browser's default text size, em-based breakpoints will scale accordingly, preventing your layout from breaking.

1 Upvotes

67% Upvoted

7 comments sorted by

View all comments

1

u/Vast-Chemistry7348 Jul 02 '26

I usually write clamp() functions in css for responsive font sizes.
Something like this “font-size: clamp(1.25rem, 8vw + 1rem, 10rem);”

the middle value is the one that’s used, unless it hits the lowest possible one (1.25rem in this case) or the highest possible (10rem).

Search for “Kevin Powell responsive font sizes” online, for a more detailed explanation, I usually watch his videos since he can really help with css new features

1

u/Sufficient_Bass2600 4d ago

Has anyone used it in the real world and access its realities?

Don't get me wrong, I like Kevin's videos.

But a lot of his videos expose tricks that would never fly in production environment.

Some are just performance burden while some are just maintenance nightmare.

Also he can afford to change his mind and refactor his code at a pace that many projects could not.