【发布时间】:2015-07-02 07:56:35
【问题描述】:
我是使用 Bourbon Neat 的新手,并且对断点的工作方式有疑问。在我的 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 排,每排 2 个,比较大的设备小,每排以 100% 的宽度堆叠。这是我的标记:
.grid-items {
@include outer-container;
.item {
width: 100%;
@include media($lg) {
@include span-columns(6);
@include omega(2n);
}
}
}
我希望这会以 100% 的宽度为项目提供服务,直到 1024 像素被击中,然后以 6 列的方式提供每个项目,并删除每个第二个项目的边距。然而,出于某种原因,它计算的宽度为 58%。它与每个断点的默认列 4、6、8、10、12 有关。如果我将这些都设置为 12,它就可以工作。我是否必须先在较小的断点处定义 span4 而不是仅在 width:100% 处定义?
【问题讨论】: