You're missing the multiplication operator in the calc function. It should be this:
calc(0.5*(1.0vmin + 1.0vmax))
calc(3.0*(1.0vmin + 1.0vmax))
2 Likes
Update:
I've actually converted back to rem units with orientation media queries for font sizes, as the calc with vmin/vmax fails with portrait displays like mobiles.
e.g.
6 Likes
Very new to this. Is there more of this you can share with me on how to implement?
@nminchin figured I'd ping here instead of starting a new thread.
Do you run into any issues using rem when it comes to mobile devices having scaled font sizes. Aka old people 150% font mode?
Previously I was still just specifying ~18px but I am starting to move over to using rem more now so revisiting this. One issue I ran into the past was a user's android device was scaling everything too much and breaking displays. One thought was having a theme that changed the Ignition font size down to compensate to make it fit normally but I'm not sure that's the best route to go.
That’s a good question, I haven't had to deal with that before/yet.
You might be able to combine the font size in rem with the clamp function so that it doesn't get increased beyond a certain pixel size. But I'd want to read, think about it and experiement a bit more before going down a path.
A quick AI suggests using clamp on the root HTML font size and setting your content to rem units as per normal. I'll let you do that AI’ing though to avoid suggesting something that is untested and doesn't work…
1 Like
Interesting, I hadn't realized you can clamp a font size in html so that gives me something to start with down the searching rabbit hole. Much appreciated