我想要一个流体网格,它通常是屏幕宽度的 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 实现这种布局?就我所见,这是一种相当常见的模式(因此我的任务是实现它),我不想每次调用容器时都需要重写。