Задать вопрос
protasovse
@protasovse
Python, JS developer
css

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

В макете для десктопа 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
  )
  • Вопрос задан
  • 192 просмотра
Комментировать
Подписаться 3 Оценить Комментировать
Решения вопроса 1
Clever_Coyote
@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)
Такая логика, надеюсь понятно будет
Ответ написан
1 комментарий
1 комментарий
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
React разработчик
Uptrade
от 150 000 до 200 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Разработать электронику для весов с Wi-Fi
26 апр. 2024, в 01:22
1000 руб./в час
Очень срочно нужно помочь запустить программу с UI
26 апр. 2024, в 00:13
1000 руб./за проект
Создание бота/скрипта для сайта забронирование мест
26 апр. 2024, в 00:10
30000 руб./за проект
Ещё заказы