0

我想要一个流体网格,它通常是屏幕宽度的 80%,最大宽度为 1440px,但低于 768px 是屏幕宽度的 100%,而不是 80%。

只有一个“容器”设置,我不确定解决这个问题的最佳方法,或者它有多大可能。

我目前的设置是:

$susy: (
    columns: 12,
    container: 80%,
    column-width: 20rem,
    gutters: $gutter/10rem,
    math: fluid,
    output: float,
    gutter-position: inside-static
);

我试图根据这样的断点有条件地覆盖这些设置:

@include breakpoint($mini) {
    $susy: (
        container: 100%
    );
}


@include breakpoint($huge) {
    $susy: (
        container: 1440px
    );
}

但这行不通,因为断点不是这样工作的。

有没有办法用 Susy 实现这种布局?就我所见,这是一种相当常见的模式(因此我的任务是实现它),我不想每次调用容器时都需要重写。

4

0 回答 0