Как в bootstrap выравнять по середине содержимое контейнера чтобы div внутри был по середине

Question

Господа IT-шники, извините за возможно глупый вопрос - просто я не верстаю сайты, но вот пришлось, что то попробовал одно другое - не понял как надо. Пока сделал на CSS но понимаю что это не верно. Bootstrap 5-ой версии ниже блок html кода в котором проблема с выравниванием:

<div class="container-xxl">
  тут ещё несколько блоков   <div class="row">с содержанием</div>
  <div class="text-center"><button type="button" class="btn btn-success">Позвоните мне!</button></div>
  <div class="row">
    <script type="text/javascript" src="https://vk.com/js/api/openapi.js?168"></script><!-- VK Widget -->**<div id="vk_groups"></div><script type="text/javascript">VK.Widgets.Group("vk_groups",{mode:3},195993868);</script>**
  </div>
</div>

Вот этот div id="vk_groups" нужно выравнять по середине. Нужен именно способ для Bootstrap.

Answer 1

"Bootstrap также включает класс .mx-auto для горизонтального выравнивания блока блока содержимого фиксированной ширины – т.е. контент, которому заданы display: block и набор width с помощью установки горизонтальных марджинов как auto."

<div class="container-xxl">
  тут ещё несколько блоков   <div class="row">с содержанием</div>
  <div class="text-center"><button type="button" class="btn btn-success">Позвоните мне!</button></div>
  <div class="row">
    <script type="text/javascript" src="https://vk.com/js/api/openapi.js?168"></script><!-- VK Widget -->**<div id="vk_groups" class="mx-auto" style="width: 200px;"></div><script type="text/javascript">VK.Widgets.Group("vk_groups",{mode:3},195993868);</script>**
  </div>
</div>

БЛОГ НА HUSL

Как в bootstrap выравнять по середине содержимое контейнера чтобы div внутри был по середине

Ответы (1 шт):