I'm experimenting with CSS and responsive design. The way I learnt about making a website generally responsive is to set the root font-size at 62.5% of the original meaning that 1rem will be = 10px. Then, with media queries, I will decrease (or increase) the root font-size according to the screen resolution, and the rest of the design that is set in rems will scale accordingly. Great.
But what about adapting the concept of fluid responsive typography? In short, the idea is that instead of setting a discrete number of media queries setting for each one a different root font-size in percentages, we use a calc() function and viewport units to set the font-size continuously — in pixels.
One could still use media queries, but only to tweak the curve(s) since CSS calc() only supports linear functions. Now, I was wondering: is this a good idea for production or should I keep this just a "cool" experiment? What about compatibility?
Thank you.