html - Susy 没有从 $grid-padding 中获得价值

Question

我在我的布局 sass 文件中对此进行了编码，

我正在使用 Susy Grid System，这是我设置的值。

$total-columns: 12
$column-width: 60px
$gutter-width: 20px
$grid-padding: 10px

问题是容器仍然给我一个 940px 的值而不是 960px。

有什么解决方案吗？

这是完整的视图。

$show-grid-backgrounds: true

@import "susy"

// For full Susy documentation, visit: http://susy.oddbird.net/tutorial/

$total-columns: 12
$column-width: 60px
$gutter-width: 20px
$grid-padding: 10px

.container
  // Include `container` if this element will contain a grid system.
  @include container($total-columns)
  // Apply our grid background stripes for development.
  @include susy-grid-background

header, #main-content, footer
  // Clearfix for full-width elements
  @include clearfix

Answer 1

我的输出（复制/粘贴您的代码）显示宽度940px和填充10px。由于将填充添加到宽度，这是正确的，并且您有一个最终960px容器。如果您使用的border-box是从宽度中减去填充的模型，Susy 可以对此进行调整，但您必须告诉 Susy。您可以将$border-box-sizing变量设置为true或使用内置的border-box-sizingmixin 将边框模型应用于所有元素。有关更多信息，请参阅文档。