Susy列溢出网格

Question

我第一次尝试susy，但遇到了一些困难。

HTML

<div class="wrap">
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
  <div class="col last"></div>
</div>

SCSS

@import "susy"; 

$susy: (
  container: 1140px, 
  columns: 12, 
  gutters: 0.5, 
  global-box-sizing: border-box, 
  debug: (image: show-columns)
);

@include border-box-sizing;

.wrap {
  @include container;
}

.col{
  @include span(3);
  height:40px;
  background:#f00;
  box-sizing: border-box;
}

我认为我有这个权利，但我的专栏是在网格之外出现的：

您可以在此处看到运行的代码：http://codepen.io/EightArmsHQ/pen/Ejjxwv

如何在网格内准确填充列？

Answer 1

您的列实际上是正确的，背景渐变是错误的。这是一个浏览器错误。请参阅documentation。