波旁威士忌整洁断点计算不正确



我是使用波旁整洁的新手,对断点的工作原理有疑问。在我的 grid_seeings.scss 中,我设置了如下断点:

$xsm: new-breakpoint(min-width 300px 4);
$sm: new-breakpoint(min-width 600px 6);
$med: new-breakpoint(min-width 768px 8);
$lg: new-breakpoint(min-width 1024px 10);
$xlg: new-breakpoint(min-width 1200px 12);

所需结果是总共 4 个项目,较大的设备每行 2 个,比较大的设备小,每个项目以 100% 的宽度堆叠。这是我的标记:

.grid-items {   
    @include outer-container;
    .item {
        width: 100%;
    @include media($lg) {
      @include span-columns(6);
            @include omega(2n);
        }
    }
}

我希望它以 100% 的宽度提供 itesms,直到达到 1024px,然后每列提供 6 列并删除每个第 2 项的边距。但是,出于某种原因,它计算宽度为 58%。它与每个断点的默认列 4、6、8、10、12 有关。如果我将这些全部设置为 12,它就可以工作。我是否必须首先在较小的断点处定义 span4,而不仅仅是宽度:100%?

> Dough,我刚刚意识到我的 lg 断点使用 10 列,所以我应该为每个项目调用 5 而不是 6。

相关内容

  • 没有找到相关文章