CSS Preprocessors

Tailor mentioned “two of my favorites example are here: http://susy.oddbird.net/ and here: http://designmodo.github.io/Flat-UI/. These are libraries I use all the time in Sass that allow me to shorten repeated CSS for grid elements and UI elements to things like this: $formcolor. Wherever I want to have rounded corners or a grid element that spans three columns responsively I can drop in a @include and include large pieces of CSS with a few keystrokes.

Sass has some good examples here that I can elaborate on tomorrow: http://sass-lang.com/.
Another awesome feature is that preprocessors enabling libraries of code that you can reference easily.
Advertisements

2 thoughts on “CSS Preprocessors

  1. Thanks for posting this, Sara!

    To add another SASS resource, I’ve started using Breakpoint (http://breakpoint-sass.com/) for my media queries in my stylesheets. I still tend to group my media query rules in one place (the “normal” way) rather than embedding them in single rules as in the examples Breakpoint provides. The big reason I use Breakpoint is the great way it lets you support IE8 if you make mobile-first sites (https://github.com/Team-Sass/breakpoint/wiki/No-Query-Fallbacks) by outputting a stylesheet with no media queries so old IE gets the full set of styles.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s