基础6 sass断点网格列折叠

Question

我的Foundation 6 scss代码出现问题，需要帮助。 我试图用Sass mixins创建以下代码。

<div class="row small-collapse medium-uncollapse large-collapse">
<div class="small-3 medium-6 large-3 columns bg-clip" style="background-color:yellow">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. 
</div>
<div class="small-3 medium-6 large-3 columns bg-clip" style="background-color:blue">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</div>

所以我有HTML

<style>
  .bg-clip {
    background-clip:content-box;
  }
</style>

<div class="box-wrap">
  <div class="box bg-clip" style="background-color:yellow">sass grid</div>
  <div class="box bg-clip" style="background-color:blue">sass grid</div>
</div>

和scss

.box-wrap {
  @include grid-row;
  .box {
    @include breakpoint(small) {
      @include grid-column(3);
      @include grid-column-collapse;
    }
    @include breakpoint(medium) {
      @include grid-column(6);
      @include grid-column-uncollapse(30);
    }
    @include breakpoint(large) {
      @include grid-column(3);
      @include grid-column-collapse;
    }
  }

}

一切都按预期工作，但在断点（大）网格列折叠不起作用......

感谢您的时间