Question

来自Susy文档：http://susy.oddbird.net/guides/reference/#ref-grid-background

SUSY GRID背景
  将Susy Grid显示为任何容器上的背景图像。

// susy-grid-background（）;   .page {@include susy-grid-background; }

如果您将元素用作Container，则需要将背景应用于元素，以使此网格背景正确调整大小。

我的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 */

在我的汉姆尔：

%body.standard

无论我尝试过什么，网格总是显示12列。有人会非常友好地指出我需要的方向让这个调试工具工作吗？

susy（1.0.rc.1）指南针（0.13.alpha.0）

Answer 1

如果您有一些断点，您还需要直接解决这些问题，以便更改$susy-grid-background列显示的列数：

.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;    
  }
}

Answer 2

$total-cols应该被称为$total-columns。该变量的名称在1.0中更改。默认设置为12列，您实际上并没有覆盖任何地方。

Susy：susy-grid-background总是显示12列，无论$ total-cols no

2 个答案: