如何在容器上设置填充？

Question

我有一个标题全宽，我想使用Susy数学设置填充，而不是每次在我的布局中重写容器的填充。

例如：

CSS：

@import "susy"; 
@import "compass/reset"; 

$susy: (
    columns: 12, 
    gutter-position: inside, 
    global-box-sizing: border-box 
); 

#header { 
    height: 80px; 
    background: red; 
} 

#footer { 
    height: 80px; 
    background: blue; 
} 

HTML：

<header id="header"></header> 
<footer id="footer"></footer> 

他们两人都是全宽，但有当然没有填充。 问题是：如何插入整个Susy默认的相同填充，如span，而不需要在容器上手动执行padding-left和padding-right？

Answer 1

Susy不对容器填充做任何事情。有没有与Susy办法做到这一点，但你可以创建自己的mixin或占位符类来为您处理它（即使使用超对称沿途）：

$container-padding: gutter(); // any size you want 

@mixin container-padding($size: $container-padding) { 
    padding-left: $size; 
    padding-right: $size; 
}