Susy响应网格

Question

我已经定义了一个基于Susy的响应式网格系统，处理4个（移动），8个（平板电脑）和12个（桌面）列。我的布局有一个固定的标题栏，分为“徽标”和“工具栏”两个部分。

“logo”div不嵌套在Susy的网格容器中，并且位于绝对位于最左侧。

“toolbar”div包含Susy网格容器并保存搜索和注销操作 - 到目前为止一直很好：）

当调整浏览器的大小时，在网格的性质中，当没有更多空间用于说12列时，可以更改总列数。这会导致以下问题：

“logo”div与网格重叠，因为它绝对定位。

有没有办法告诉Susy在到达“logo”div的黑色边框之前将布局分解为8列？

任何建议都将受到高度赞赏。提前谢谢。

Answer 1

@Eric：我设法让它运转起来。这是使用的：

@mixin update-container {
    @include container;
    @include susy-grid-background;
}

.page {
    @include update-container;

    @include at-breakpoint(865px 8 1149px) {
        @include update-container;
    }

    @include at-breakpoint(1150px 12) {
        @include update-container;
    }
}

所以我明确地描述了最小和最大宽度来告诉列何时改变。这是“正确”的方式还是有更优雅的方法来解决这个问题？

谢谢：）