Hi,
I’m trying to understand how to create responsive heading text with the “calc” option. I like big fonts - it looks great on PC, but I really need to be able to control the text size for mobiles.
If you take a look at this page - I’ve used this text setting: calc(4em + 0.7vw). It works fine on PC, but it is way to large on mobile. If I lower the “em”, the text will be smaller on PC, and I don’t want that, so what can I do to control it better?
Thanks in advance!
Hey @Kobber,
The em + vw setup is like a Minimum (em) and Maximum (vw) font-size setup though it’s not exactly that. You need to balance out the size like decreasing the em and increasing the vw. Try calc(2.6em + 2vw).
I think it’s not possible to explain this in detail so I’m going to point you to a couple of articles that explain Fluid Typography. Please read the articles below:
Hope that helps.
You’re the man Christian! I thought it was the other way around ;-).
Thanks!
You are most welcome. 
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.