Skip to content

Instantly share code, notes, and snippets.

@laere
Forked from mrwweb/reset-rems
Created January 28, 2016 16:37
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save laere/29bab32042ef92efb3d7 to your computer and use it in GitHub Desktop.
Save laere/29bab32042ef92efb3d7 to your computer and use it in GitHub Desktop.
"Sanity-ize" REMs by setting them to 10px-baseline aka "Tiny Happy Pixels Dancing."
/* this is the "root" in "root em." */
html {
font-size: 62.5%; /* Now 10px = 1rem! */
}
body {
font-size: 16px; /* px fallback */
font-size: 1.6rem; /* default font-size for document */
line-height: 1.5; /* a nice line-height */
}
/* for everything else, rem = px/10 */
footer {
font-size: 13px;
font-size: 1.3rem;
}
/* you can safely nest rems, it's still 1rem = 10px */
footer small {
font-size: 10px;
font-size: 1rem;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment