Bootstrap Grid на мобильном телефоне

Question

Сетка не работает на мобильных устройствах: .col-xs-3 на полном экране, col-xs-3 работает как col-xs-12, есть идеи?

<div class="container">

      <div class="row">
      
        <div class="col-md-1 col-xs-3">
          <a href="#">
            <img src="/.."  />
          </a>
        </div>
        
        <div class="col-md-1 col-xs-3">
          <a href="#">
            <img src="/.."  />
          </a>
        </div>
        
        <div class="col-md-1 col-xs-3">
          <a href="#">
            <img src="/.."  />
          </a>
        </div>
        ...
        
    </div>
      
</div>

Answer 1

Вы уверены, что начальная загрузка связана и что вы используете Chrome на своем мобильном устройстве?

Answer 2

1) Если используемая вами версия начальной загрузки - 4, в начальной загрузке 4 нет точки останова xs.Вместо этого точка останова xs используется по умолчанию, а для других точек останова вы должны использовать точки останова.так, например, если вы хотите 3 на мобильном телефоне и 1 на md и выше, вы должны сказать

col-3 col-md-1

2) Пожалуйста, убедитесь, что необходимые метатеги находятся в разделе заголовка вашего кода, то есть

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">