I’ve been trying really hard to learn to make text responsive.
I found a lot of resources but didn’t understand anything or the methods mentioned weren’t good practice.
I thought using vw and vh was the way and that I had finally figured it out.
But then someone told me it wasn’t good
How doI make my text responsive?
THANKS!!!
It’s funny I came across a video about clamp and came here to answer my own question.
And I saw your answer lol.
BTW check out this video for those who are facing the same issue, clamp works with margin padding etc as well
A boon for web designers(clamp)
Another awesome resource if you are not understanding the clamp function’s parameters :-
I would not follow the advice in this video as far as using vw units only for the middle value in clamp. Using only vw units takes away the ability of the user to manually increase the text size. This is an accessibility issue.
By the way, text is already responsive by default, you aren’t really making it more responsive using clamp. I think there are some circumstances where changing the font size based on width are appropriate, such as decreasing the size of big headings for narrower widths (which can help reduce horizontal scrolling). But be careful that you do not make text too small. You also should respect the user’s default font size and their ability to increase the font size as needed, so use em (or rem) units for all of your font sizes. And if you do want to take into account the width of the view port then it should be in addition to the em font size (e.g font-size: calc(1em + 1vw);).
NOTED!
THIS IS WHAT I WAS LOOKING FOR!!!
THANKS A LOT!
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.