Since we started using Sass in our projects here at intuio, our workflow has improved a lot. There are a lot of useful mixins out there, let alone the comprehensive compass mixins library. Given the fact that most of our projects are to be designed responsive, we do only use relative sizing units. While ‘em’ units can cause a lot of headache because it’s up to you to always calculate the desired values, ‘rem’ units are a great relief for every designer.
As Jonathan Snook explained before, using ‘rem’ with a ‘px’ fallback is perfectly fine for all major browsers (including IE8) and there is a nice mixin for setting the font-size by Chris Coyier. Heck, there’s even a very similar mixin published by bitmanic but none of these perfectly fit our needs. We love to work with unitless variables, which is why I created (yet) another mixin that covers just that coding style. Lets dig into some code…
There are a couple of assumptions:
You use unitless numbers
Your html font-size is set to 62.5%
So far so good, now let’s look at the mixin.
So, if you’re working with unitless number as we do, this little mixin might come in handy. I am sure there is room for improvement and I would love to hear any suggestions. Happy coding!