работаю в Opencart 3, Bootstrap 3. Сделал footer, но при разрешение sm(меньше 992) колонки смещаются и получается свободное пространство, что делаю не так?
<footer>
<div class="container-fluid">
<div class="row">
{% if informations %}
<div class="col-md-3 col-sm-6">
<h5>{{ text_information }}</h5>
<ul class="list-unstyled">
{% for information in informations %}
<li><a href="{{ information.href }}">{{ information.title }}</a></li>
{% endfor %}
</ul>
</div>
{% endif %}
<div class="col-md-3 col-sm-6">
<h5>{{ text_service }}</h5>
<ul class="list-unstyled">
<li><a href="{{ contact }}">{{ text_contact }}</a></li>
<li><a href="{{ return }}">{{ text_return }}</a></li>
</ul>
</div>
<div class="col-md-3 col-sm-6">
<h5>{{ text_extra }}</h5>
<ul class="list-unstyled">
<li><a href="{{ voucher }}">{{ text_voucher }}</a></li>
<li><a href="{{ affiliate }}">{{ text_affiliate }}</a></li>
<li><a href="{{ special }}">{{ text_special }}</a></li>
</ul>
</div>
<div class="col-md-3 col-sm-6">
<a href="tel:{{ telephone }}" class="phone" title="Нажми чтобы позвонить нам">{{ telephone }}</a>
<a href="mail:{{ email_2 }}" class="email">{{ email_2 }}</a>
<a href="lendik.me" class="powered">{{ text_powered }}</a>
<div class="soc">
<a href="http://lendik.me" target="_blank"><i class="fa fa-vk"></i></a>
<a href="http://lendik.me" target="_blank"><i class="fa fa-twitter"></i></a>
<a href="http://lendik.me" target="_blank"><i class="fa fa-instagram"></i></a>
</div>
</div>
</div>
</div>
</footer>
Колонки должны идти в такой порядке: Информация, Служба поддержки, Дополнительно. Но после службы поддержки появляется невидимая колонка. Стилизация не как не влияет пробовал выключать css
в row обвёрнуты все col-sm-6. Таким образом, если в row у блоков разная высота и блоков больше чем на 12 колонок (а сейчас на 24), bootstap выстаивает их в соответствии с их индексом колонок но "гапит" под теми блоками, которые по высоте больше. Т.е. вы наблюдаете, как он компенсирует высоту смежных блоков с разной высотой.
Задайте этим блокам (тем что внутри данного row, первые потомки - col-sm-6) min-height равное высоте самого высокого из них.
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости