A nice little introduction to what’s new and important in CSS layout.

Because every so often, I think: Let’s use Compass spriting! It’ll save me time! Then I spend an hour looking up how the syntax works.

@import "compass/utilities/sprites";
$social-sprite-map: sprite-map('social/*.png');

@mixin active-social($name) {
  @include sprite-replace-text-with-dimensions($social-sprite-map, footer-#{$name});
  &:hover {
    @include sprite-replace-text-with-dimensions($social-sprite-map, footer-#{$name}-active);
  }
}

.footer-twitter {
  @include active-social(twitter);
}

.footer-facebook {
  @include active-social(facebook);
}

.footer-gplus {
  @include active-social(gplus);
}

Responsive design + cat. THIS STUFF IS IMPORTANT, PEOPLE

(Via Sacha Greif’s Sidebar.io, a daily collection of the 5 best design links.)

Been waiting YEARS for something like this:

H9RBS.js (v0.0001) is a flexible, dependency-free, lightweight, device-agnostic, modular, baked-in, component framework MVC library shoelacestrap to help you kickstart your responsive CSS-based app architecture backbone kitchensink tweetybirds.

Like those ads of old. So much nostalgia! The secret message is great, too.