I've been trying to implement a sass function translating Px to Rem like this one https://css-tricks.com/snippets/sass/px-to-em-functions/#comment-1660199 or this one https://45royale.com/blog/convert-pixels-to-rems/.
Basically the function would be something like this:
$browser-context: 16px; // default
@function rem($pixels, $context: $browser-context) {
@return #{$pixels/$context}rem;
}
I'm a bit confused because I wonder if this technique works when scaling fonts in different viewport sizes. I mean If you set font-size: 10px on (say, via media query), then rem(32px) will still result in 2rem, which is then computed to 20px, right? So, rem(32px) results in a computed value of 20px if the font-size is set to 10px. Isn’t that a bit confusing?
