I have a very straightforward Sass function that converts a pixel value to a rem value:
@function to-rem($pxval) {
@return #{$pxval / $base-font-size}rem;
}
For example, using to-rem(24) would output 1.5rem.
However, I recently ran into an issue where older versions of IE do not support rem units. To overcome this, I added a flag for old IE and adjusted the function accordingly:
@function to-rem($pxval) {
@if $old-ie {
@return #{$pxval}px;
} @else {
@return #{$pxval / $base-font-size}rem;
}
}
Now, I need to consider Opera Mini as well, which also does not support rem units. Unfortunately, I don't have a filter specifically for Opera Mini like I do for old IE. Any suggestions on how I can handle this without resorting to a mixin?
While I do have a mixin that achieves the same result, I prefer using the function for single values as it's more concise. For instance, using the function for padding:
padding: to-rem($spacing-base) 0;
is simpler than using the mixin:
@include to-rem(padding, $spacing-base 0);