For my MMP 240 class, I was asked to states my opinion regarding different techniques and trends for font sizing: would I use px, %, em or rem units or what do I think of certain techniques like resetting to 10px via the 62.5% CSS declaration?

Well, definitively, I think ems units are the unit to go with if we want to design “responsive”. And now a days, responsive design is paramount. However, it is sometimes very cumbersome to keep track of the real size of each element, more importantly the nested ones since the em value is relative to the size defined in its parent element.

I first heard about rem in my MMP 240 class and reading more about it I find it convincing. Now I have to put it into practice. But basically, here’s why I like it:

No matter where we set the size, we will know its value since it’ll always be relative to the size set in one single place: the HTML CSS rule.
It is then very easy to control the overall sizes adding breakpoints at different screen sizes via CSS media queries.

One downfall: it is not yet supported by all browsers like you can see here:

But, this is something I would not worry too much about since, we can set up in the CSS rule a fallback pixel size. Actually, with techniques like SASS or LESS it is pretty easy to set this up with mixins.

Regarding the 62.5 solution, although it facilitates our calculations, I would not use it. I like to set my default font bigger: 14 or 16px. Many blogs now a days use pretty big font sizes. I think it makes the reading more comfortable. Don’t you?

Actually, I liked the post of Tracy Rotton and I agree with her: The most important thing is to set the default size in terms of what we actually want it to be. If we want it to be 10px, fine, but if not, then do not worry about the maths, let the browser calculates!