Skip to content

Instantly share code, notes, and snippets.

@jcroft
Created March 1, 2012 04:51
Show Gist options
  • Save jcroft/1947357 to your computer and use it in GitHub Desktop.
Save jcroft/1947357 to your computer and use it in GitHub Desktop.
How easy responsive design can be with Sass
#content-wrapper
+container
#about
// Default (smallest screens)
+column(100%)
background-color: #ccc
// Respond to other screen widths
+respond-to(tablet)
width: 33.333%
+respond-to(desktop)
width: 25%
#primary-content
+column(100%)
+respond-to(tablet)
width: 66.666%
+respond-to(desktop)
width: 50%
#secondary-content
+column(100%)
display: none
+respond-to(desktop)
width: 25%
display: block
@mislav
Copy link

mislav commented Mar 24, 2012

You forgot to mention it requires a prerelease of Sass (3.2.0.alpha). Tried it with stable and it exploded.

Otherwise, totally killer feature.

@jcroft
Copy link
Author

jcroft commented Mar 24, 2012 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment