Задать вопрос
AlibekKulseitov
@AlibekKulseitov
Люблю верстать и писать музыку

Как адаптировать этот блок?

Добрый вечер!) Все ломаю голову как адаптировать данный блок? joxi.ru/bmo0xqZhMkdlY2
Каким образом этот блок должен отображаться на мобильных, планшетах итп. Ну думаю если вы предложите какой-то свой метод или уже имели дело с такими блоками то помогите). Может вы знаете какие-то методы или фичи)
Сайт адаптирую под 3 размера пк, планшеты, мобилки.
  • Вопрос задан
  • 153 просмотра
Подписаться 2 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 2
AppFA
@AppFA
Frontend developer at Yandex
При десктопном разрешении показываете 4 блока поряд.
При планшетом 2 блока подряд, а при мобильном 1 блок, так же думаю стоит убрать весь текст под спойлер и добавить кнопку "Подбробнее" при мобильном разрешении, чтобы пользователь не скролил пол года всю страницу.
Ну и соответственно в CSS что-то в этом роде
.blocks {
    display: inline-block;
    width: 25%;
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .blocks {
        width: 50%;
    }
}

@media screen and (min-width: 320px) and (max-width: 768px) {
    .blocks {
        width: 100%;
    }
}
Ответ написан
Может вот это решение подойдет
https://codyhouse.co/gem/products-comparison-table/
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы