19 февраля 2017 в 16:45
Хороших выходных! На сайте, ч\з views (page) вывожу каталог товаров в две колонки (формат - grid). На компьютере отображается красиво, но на планшете нужно отображение в одну колонку. В настройках Grid ->Custom column class вставила = col-sm-1. Получилось 2 колонки на компьютере и одна на планшете. Все хорошо.... Но ширина колонки на планшете = 50%. Как мне получить width: 100%?
Комментарии
Если Bootstrap
col-sm-1 это 1/12 колонки от 768px до 992px по ширине, правильный ответ будет такой:
col-md-12 col-lg-6ну тут нужно еще уточнить какое разрешение браузера у вас принимает планшет, например IPad 1024px, а многие android устройств от 480px - 768px.
Не поняла (((.... Мне нужно на планшете 1 колонка, но по всей ширине экрана (планшетного). А куда мне писать col-md-12 col-lg-6? И зачем?
На мониторе компьютера пусть остается 2 колонки (тоже по всей ширине).
Вам нужно писать там где вы писали col-sm-1
http://bootstrap-3.ru/css.php ...тут описано, что по чем, да еще и на русском
Пошла читать css....... Не пойму зачем мне нужно указывать три css, когда сработал col-sm-1.... Проблема только в том, что он не растянул ширину колонки до width: 100%
Выложите сайт и то место где у вас проблема.
view выводит grid в поток со своей разметкой, выберите неформатированный список и пропишите ему классы бустрапа и у вас всё встанет как надо
col-sm-1 это 1/12 ширины контейнера. Никак не 100%. Выше вам всё правильно посоветовали.
gun_dose, спасибо. Все ок, хоть и не поняла я ничего /тупо повторила Вашу рекомендацию/. Пошла читать мат. часть. Mihail.space, большое спасибо! "grid в поток со своей разметкой" - фраза поставила мозг на место. Сейчас Format:Unformatted list; Settings = Row class = .col-md-12 .col-lg-6