CODEWITHSUNDEEP
csscompass-sasssasssusy-compass
ian
ian

Reputation: 12251

Susy: susy-grid-background always shows 12 columns regardless of $total-cols no

From the Susy docs: http://susy.oddbird.net/guides/reference/#ref-grid-background

SUSY GRID BACKGROUND
Show the Susy Grid as a background-image on any container.

// susy-grid-background(); .page { @include susy-grid-background; }

If you are using the element as your Container, you need to apply a background to the element in order for this grid-background to size properly.

Snippets of my css:

$total-cols     : 16;
$column-width   : 4em;
$gutter-width   : 1em;
$grid-padding   : $gutter-width;

html { background: #fff no-repeat left top; }    

.standard {
  @include container; 
  @include susy-grid-background; /* Susy */

and in my Haml:

%body.standard

Whatever I've tried the grid always shows 12 columns. Would anyone be kind enough as to point me in the direction I need to go to get this debug tool to work?

susy (1.0.rc.1) compass (0.13.alpha.0)

Upvotes: 1

Views: 3321

Answers (2)

cseelus
cseelus

Reputation: 1679

If you have some breakpoints, you also need to address these directly in order to change the number of columns $susy-grid-background shows:

.page {
  @include container ($total-columns, $break1, $break2);

  @include susy-grid-background;

  @include at-breakpoint($break1)  {
    @include susy-grid-background;
  }
  @include at-breakpoint($break2)  {
    @include susy-grid-background;    
  }
}

Upvotes: 5

Miriam Suzanne
Miriam Suzanne

Reputation: 14010

$total-cols should be called $total-columns. The name of that variable changed in 1.0. The default setting is 12 columns, and you are not actually overriding that anywhere.

Upvotes: 2

Related Questions