Skip to content

Instantly share code, notes, and snippets.

@greduan
Created November 22, 2014 01:10
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 greduan/3e95d468954e99f8d1db to your computer and use it in GitHub Desktop.
Save greduan/3e95d468954e99f8d1db to your computer and use it in GitHub Desktop.
Simplest thing I've found for responsive sites, works pretty well
/* REMEMBER TO CHANGE THE FONT SIZES FOR YOUR OWN WEBSITE */
/* higher than 900px wide screen */
body {
max-width: 700px;
padding: 0 10px;
margin: 0 auto;
}
/* 900px or smaller width screen */
@media (max-width: 900px) {
html {
font-size: 20px;
}
body {
max-width: 600px;
padding: 0 10px;
margin: 0 auto;
}
}
/* 400px or smaller width screen */
@media (max-width: 400px) {
html {
font-size: 16px;
}
body {
max-width: 300px;
padding: 0 10px;
margin: 0 auto;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment