在一排列上使用'@include media'会让波旁的变化变得整齐

Question

当我的代码

时，已经出现了这个相当恼人的错误

benefits {
@include outer-container;

.benefit_text {
    @include span-columns(4);
    @include shift(2);
}

.benefit_list {
    @include omega();
    @include span-columns(4);

}

.testing {
    @include shift(2);
    @include span-columns(8);
    @include omega();
}


}

但是，如果我尝试添加媒体断点，例如

，则应该是对齐

benefits {
@include outer-container;

.benefit_text {
    @include span-columns(4);
    @include shift(2);
    @include media($tablet) {
        @include span-columns(9);
        @include shift(0);
    }
}

.benefit_list {
    @include omega();
    @include span-columns(4);
    @include media($tablet) {
        @include span-columns(9);
    }
}

.testing {
    @include shift(2);
    @include span-columns(8);
    @include omega();
}

}

由于某种原因，最后一个div的对齐关闭（大约一个半列太多） 这种情况发生在较大的屏幕上，即使它确实在我的$平板电脑断点（即768px，9）上没有任何问题时放下了这些列

令人沮丧，因为示例http://neat.bourbon.io/examples/没有说明其大小在调整大小时如何降低到全宽（特别是具有多行的示例） 我甚至试图将两个列包装在一个行包装器中并将移位应用到包装器，但这似乎将两个柱子挤在一起，而不是感谢任何帮助！