Как на Susy сделать различное количество колонок для разных устройств?

Question

[Сергей Протасов]

В макете для десктопа 12 колонок, для планшета - 10 колонок, для мобилы 3.
Можно ли для различных устройств настроить различное количество колонок?

Так должно быть для десктопа:

$susy: (
    columns: 12,
    gutters: 3/7,
  	container: 81.25%,
  	math: fluid,
  	output: float,
  	gutter-position: after
  )

так для мобильной версии:

$susy: (
    columns: 3,
    gutters: 3/7,
  	container: 87.5%,
  	math: fluid,
  	output: float,
  	gutter-position: after
  )

Answer 1

[Clever_Coyote]

Вы видимо немного не поняли.
Количество колонок меняется с помощью медиа квери. На враппер вешается @include container() на дочерний блок @include span(12),
media screen and (max-width: 768px) @include span(10)
media screen and (max-width: 414px) @include span(3)
Такая логика, надеюсь понятно будет

Comments

[Сергей Протасов]

да, благодарю! Я действительно, не до конца понял логику работы Susy..