Question

我只是想熟悉新的Susy Next选项，我有我的代码：

.grid
   +clearfix
   clear: both

.grid__item
   +gallery(1)
   +rem(margin-bottom, 20px)

我想在.grid中设置一个5列网格，以便.grid__item跨越图库中的1列。

如果我在+with-layout(5 1/4 fluid show background)中添加.grid，那么我无法获得调试后台输出。

如果我在+container(5 1/4 fluid show background)内添加.grid，那么我会得到背景信息，但由于上下文不存在，所以项目无法正确跨越。

是否有任何关于如何使用+with-layout的文档，因为我认为这可以解决它但可以在http://susydocs.oddbird.net/en/latest/install上找到任何内容

我只是在使用Susy Next解决此问题的最佳方式之后。我需要.grid包含5个带有1/4排水沟的流体柱，然后允许我根据它来跨越我的.grid__item。我还需要能够在.grid上输出调试背景。

我认为我的主要问题是我在：+container，with-layout以及事物如何融合之间感到困惑。我已经阅读了最新的文档，但它并没有完全点击我的脑袋。

可能只是我！

Answer 1

您需要建立网格。 with-layout是为一小块嵌套代码执行的一种方法，但为什么不直接设置它们呢？有几种方法可以做到，所有这些documented，但很可能你只想要layout() mixin：

// note that it isn't nested under anything. +layout(5 1/4 fluid show background)

现在您有了一个全局上下文，您可以构建网格：

.grid +container .grid__item +gallery(1)

就是这样。如果您真的只想要一小部分代码的网格集，则可以使用with-layout。它的工作方式与layout类似，但它只影响嵌套在其中的代码。

// with-layout() for a nested code block: +with-layout(5 1/4 fluid show background) .grid +container .grid__item +gallery(1)

Susy Next Grids

1 个答案: