Bootstrap — Как уменьшить количество колонок до двух?

Question

[poimanoo]

Здравствуйте.
Приобрел в интернете html-шаблон сайта-магазина, в нем используется bootstrap. При просмотре на мониторе на сайте товары располагаются в 4 колонки, однако при просмотре в телефонном режиме 4 колонки превращаются в одну. Вопрос: как я могу добиться того чтобы как при просмотре через монитор так и при просмотре через телефоны/планшеты и т.д. товары всегда отображались лишь в две колонки?

Comments

[Hyubert]

.col-md/sm-6

PS. какой вопрос такой ответ

[poimanoo]

Hyubert: это у самих элементов изменить? сейчас там стоит div class="col-md-3 col-sm-4 col-xs-12"

[paramid]

надо смотреть какие .col-md-x
md - в данном случае размер экрана
x - количество колонок под этот размер экрана.
читай

[paramid]

poimanoo: 12 у xs меняй на 6

[poimanoo]

Всем спасибо!

Answer 1

[vman]

в bootstrap применяется сетка из 12 колонок, соответственно, размер колонок при том или ином разрешении регулируется через классы col-(lg|md|sm|xs|)-*

если для колонки задать классы

<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> ..... </div>

то она всегда будет занимать 50% от ширины строки

https://getbootstrap.com/docs/3.3/css/#grid

Answer 2

[Yustas Alexu]

<div class="row">
    <div class="col-xs-6"></div>
    <div class="col-xs-6"></div>
</div>