test: http://stackoverflow.com/questions/20876554/the-grid-span-function-dont-work-with-singularitygs-and-rails

index.html

<header>
  <div class="container">
    <div class="logo">Logo</div>
    <div class="user">User</div>
  </div>
</header>

style.scss

/* Mixins */
@import 'compass';
@import 'breakpoint';
@import 'singularitygs';

/* Variables */
$grids: 12;
$gutters: 1/3;

/* Styles */
* { @include box-sizing('border-box'); }

.container {
  @include background-grid;
  margin: 0 auto;
  min-height: 100%;
  max-width: 960px;

  @include clearfix;
}

header {
  .logo { 
    @include grid-span(4, 1);
    background-color:red;
  }
  .user { 
    @include grid-span(4, 9); 
    background-color:green;
  }
}