Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save ricardoaguiar/8e33a8d6a7a0ac3d2a6b428057395ea3 to your computer and use it in GitHub Desktop.
Save ricardoaguiar/8e33a8d6a7a0ac3d2a6b428057395ea3 to your computer and use it in GitHub Desktop.
Note: the font-size: 62.5% thing on the html element is for switching to base 10 for the ease of calculations (default 16px * 62.5 / 100 = 10). From there, it’s easy to say 1.3rem + 13px.
.font-size($pxValue){
@remValue: (@pxValue / 10);
font-size: ~"@{pxValue}px";
font-size: ~"@{remValue}rem";
}
html { font-size: 62.5%; }
.my-element {
.font-size(13px);
}
/* Output CSS */
.my-element {
font-size: 13px; /* Internet Explorer 6/7/8 + Opera Mini */
font-size: 1.3rem; /* Other browsers */
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment