Skip to content

Instantly share code, notes, and snippets.

@navitronic
Created April 12, 2012 05:36
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save navitronic/2364783 to your computer and use it in GitHub Desktop.
Save navitronic/2364783 to your computer and use it in GitHub Desktop.
Responsive CSS boilerplate
/* Mobile / General Styles
---
Code up general styles and mobile styles, use media queries to adapt to larger displays.
Things for this section: Reset, Typography, Baseline grid, etc. Convenience methods for image-replacement, hiding, clearing etc.
*/
/* Desktop and iPad/Tablet specific styles. */
@media only screen and (min-width: 35em) {
/* Delete me if empty!!! */
}
/* iPad/Tablet specific styles. */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
/* Delete me if empty!!! */
}
/* iPad/Tablet landscape specific styles. */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
/* Delete me if empty!!! */
}
/* iPad/Tablet portrait specific styles. */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
/* Delete me if empty!!! */
}
/* Mobile specific styles */
@media only screen and (max-width: 35em) {
/* Delete me if empty!!! */
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment