Responsive Text: What do the different measurements mean and do?

Support
#1

Hello!

I have basically just visually messed around with the several types of measurements in Cornerstone to achieve my final look, but I believe it’s time for me to actually use them for the intended purpose.

%: this obviously means text is grown my a percentage, but based on what?
cacl: these seems to deal with responsive text, but I can’t figure out the equation.
em: no idea what this is
px: this means size by pixel, but now sure when I should use this.
rm: no sure what this means

MAIN QUESTIONS:
Is there a PDF with the definitions of these and scenarios on when I should use them?
How can my text size based on viewport; ie: mobile view?

#2

Hey Duane,

Those are basically just CSS units. You can learn them here https://www.w3schools.com/cssref/css_units.asp

For font size based on the viewport, please learn the setup from this article https://www.smashingmagazine.com/2016/05/fluid-typography/

You can see that applied to the Button element here https://youtu.be/SdQHpAgFumw

Hope that helps.

#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.