6列网格中的5列

Question

我有一个6列固定宽度网格，但我想要一个特定的“行”代替5列，这可能吗？

@import "susy";
@include border-box-sizing;

// The 1000px grid
$total-columns: 6;
$column-width: 150px;
$gutter-width: 20px;
$grid-padding: 0;

$container-style: static;
$container-width: 1000px;

$show-grid-backgrounds  : true;

感谢

Answer 1

当然可以。所有Susy数学都只基于columns / context，所以你可以通过向Susy说上下文来获得尽可能多的列。

$total-columns: 6;

.container {
  @include container;
  .tricky {
    @include span-columns(1,5); // tell Susy there are 5 columns, and suddenly there are.
  }
}

如果您想对此更加诚实，或者为更大的代码块设置默认上下文，您可以简单地将该代码包装在layout(5) { ... }或with-grid-settings(5) { ... }中并在该块{{1}内1}}。