用波旁威士忌（平板电脑，桌面）重新排序列

Question

我正在尝试在顶部（移动视图）和下面的侧边栏上创建一个“内容”页面。

这是我的HTML：

<section>
  <div class="homepage-content"></div>
  <div class="homepage-sidebar"></div>
</section>

这是我使用波本威士忌的scss：

section {
      @include outer-container;
}

.homepage-content {
      @include span-columns(8);
      @include shift(4); /* this block should be on the RIGHT on desktop/tablet view */
    }

.homepage-sidebar {
      @include span-columns(4);
      @include shift(-8);
}

我的印象是“转移”向右移动（正向），然后向左移动为负数。

所以我认为“内容”是8列宽，然后向右移动。所以我的内容将在右侧。

似乎正在发生的事情是我的“内容”div现在位于我的“侧边栏”div上：