Lightweight, customizable CSS grid in Sass
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
LICENSE
README.md
_grid.css
_grid.scss
index.html

README.md

_grid.scss

Lightweight, customizable CSS grid in Sass. As seen on thegreatsunra.com.

Supports nested grid sections, pushing and pulling, and appending or prepending.

Usage

Include Compass and _grid.scss in your styles if you wish to customize column widths, gutter widths, or the number of columns.

Include _grid.css in your styles if you wish simply to use it out-of-the-box.

@import "compass";
@import "_grid.scss";
...
<div class="container">
  <div class="span-8">
    <div class="span-2">span-2</div>
    <div class="span-6 last">span-6</div>
    <div class="span-4">span-4</div>
    <div class="span-4 last">span-4</div>
  </div>
  <div class="span-4 last">span-4</div>
    <div class="span-2">span-2</div>
    <div class="span-2 last">span-2</div>
    <div class="span-3">span-3</div>
    <div class="span-1 last">span-1</div>
  </div>
  <div class="span-6">span-6</div>
  <div class="span-6 last">span-6</div>
  <div class="span-12"></div>
</div>