Skip to content

Instantly share code, notes, and snippets.

@scsskid
Created February 16, 2018 11:14
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save scsskid/c6a8af7b4940094217aeace786004f60 to your computer and use it in GitHub Desktop.
Save scsskid/c6a8af7b4940094217aeace786004f60 to your computer and use it in GitHub Desktop.
/**
* Convert font-size from px to rem with px fallback
*
* @param $size - the value in pixel you want to convert
*
* e.g. p {@include fontSize(12px);}
*
*/
// Function for converting a px based font-size to rem.
@function calculateRem($size) {
$remSize: $size / 16px;
//Default font size on html element is 100%, equivalent to 16px;
@return #{$remSize}rem;
}
// Mixin that will include the fall back px declaration as well as the calculated rem value.
@mixin fontSize($size) {
font-size: $size;
font-size: calculateRem($size);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment