Skip to content

Instantly share code, notes, and snippets.

@landru247

landru247/CSS: responsive text.css

Created January 28, 2014 23:20
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save landru247/8678713 to your computer and use it in GitHub Desktop.
Save landru247/8678713 to your computer and use it in GitHub Desktop.
Download ZIP
CSS: responsive text - Percentage based
Raw
CSS: responsive text.css
html { font-size: 100%; }
body { line-height: 1.6875; font-family: 'Lato', arial, helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Bitter', arial, helvetica, sans-serif; font-weight: 700; margin-top: 0; line-height: 1.1; }
h1 { font-size: 200%; }
h2 { font-size: 180%; }
h3 { font-size: 160%; }
h4 { font-size: 120%; }
h5 { font-size: 100%; }
h6 { font-size: 80%; }
p { color: #666; font-size: 100%; font-weight: 500; margin-bottom: 5%; }
@media (min-width: 768px) {
body { font-size: 80%; }
}
@media (min-width: 992px) {
body { font-size: 100%; }
}
@media (min-width: 1200px) {
body { font-size: 120%; }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment