更改Zurb Foundation网格列,以便仅在一侧填充

Question

有没有人知道是否有设置将柱式排水沟只放在一侧？目前它在色谱柱的每一侧增加了一半,因此,例如,如果您想要一个14px色谱柱装订线,则每侧会增加7个像素.这会导致一行中的第一列具有7px缩进.

我可以使用额外的CSS破解它,但如果可以,我宁愿在默认设置中更改它.

Answer 1

据我所知,如果不创建自己的mixin或修改现有的grid-column mixin,这是不可能的,而这对于像这样的简单案例来说并不是你想做的事情.

我建议为此创建自己的类,例如:

上海社会科学院

.left-collapse {
  .columns {
    padding-left: 0;
    padding-right: $column-gutter;
  }
}

然后只需将类添加到您的父行,几乎就像您想要使用折叠类来删除所有装订线宽度 - 所以你的行将如下所示:

<div class="row left-collapse">
   <div class="large-4 columns">FOO</div>
   <div class="large-4 columns">FOO</div>
   <div class="large-4 columns">FOO</div>
</div>

如果您没有使用SASS,那么只需在CSS文件的填充右侧添加$ column-gutter大小(默认为v4:1.875em).