@thedexploit
Сайтами маюсь

Как задать ширину блока на мелких экранах?

Блог на WordPress с магазином Woocomerc. Страница с категориями товаров состоит из трех товаров в ряд.
Когда страница ужимается (на мобильных устройствах) товары налазят друг на друга.
Как сделать что бы товары просто переносились на новую строку?
Не помещается три? - один значит падает ниже.
По умолчанию стоит значение width - 30% .
Если ставить 100, то на мелких экранах работает отлично (один товар в ряд)
Может можно обозначить что если разрешеие менее 900 в ширину то размер блока 100%?
  • Вопрос задан
  • 112 просмотров
Решения вопроса 1
в теге head пропишите
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

а в css пишите медиа запросы
@media only screen and (min-width: 481px) and (max-width: 769px) {
здесь пишите стили которые будут применяться в рамках нужных брейкпоинтов
}


Смотрите в эту сторону
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
seoperin
@seoperin
Full stack web developer. Laravel / Vue
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы