Skip to content
A port of Skeleton's responsive grid framework to SASS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

One Sassy Skeleton

Skeleton's responsive CSS grid rocks. But some of us don't like muddling up our clean semantic HTML markup with grid framework classes. The value of CSS is in letting you separate presentation and content, so a good CSS grid framework will let you use it completely in your own site's CSS, by applying grid widths to your pre-existing CSS classes and selectors.

Skeleton-Sass is a one-to-one translation of the classes in Skeleton's grid framework, but remixed as Sass mixins. Instead of giving a div a class of six columns, inside your own CSS specifying the div you'd simply include the mixin +columns(6).

The other big advantage of Skeleton-Sass is that the actual grid widths are only calculated at compile-time. This means that your page width, number of columns, and margin sizes are all easily tweakable if you want to mix things up —- say, switch from a 16-column grid to a 24-column, or bump everything up to 1024px instead of 960px.

Right now, this is only a port of Skeleton's grid system. There's no problem using Skeleton-Sass side by side with normal Skeleton CSS files if you use other non-grid features of Skeleton (or your other CSS framework of choice!).

You can’t perform that action at this time.