Font sizing with REM and PX (LESS)

gistfile1.css

// ABOUT
A simple LESS (http://lesscss.org) snippet based on http://snook.ca/archives/html_and_css/font-size-with-rem
It doesn't do much but saves you typing things twice, allowing you to use rem as a unit for font-sizes 
and giving a px fallback for IE

// MIXIN
.font-size(@font-size: 16){
    @rem: (@font-size / 10);
    font-size: @font-size * 1px;
    font-size: ~"@{rem}rem";
}

// USE
html { font-size: 62.5%; } // Needed to make 1em equal 10px

body {
    .font-size(); // Uses the default font-size of 16
}

h1 {
    .font-size(42); // Gives a font-size based on 42px (the font-size of life, the universe, and everything)
}

// OUTPUTS
html { font-size: 62.5%; }

body {
    font-size: 16px; 
    font-size: 1.6rem;
}

h1 {
    font-size: 42px; 
    font-size: 4.2rem;
}

I've written a Sass mixin which allows for generic rem with px fallbacks on any property:
https://gist.github.com/4153104/a5f13471af86e9835f18beda817ed772fcd9973a

May help you out if you're using px fallbacks already on other properties!