Как в bootstrap выровнять форму по центру?

@cayla 

Bootstrap имеет несколько классов для выравнивания элементов по центру. Вам нужно добавить класс "mx-auto" и "d-block" к элементу формы, чтобы выровнять его по горизонтали и по вертикали.

Пример:

1
2
3
4
5
6
7
8
9

<div class="container">
   <div class="row">
      <div class="col-md-6 mx-auto">
         <form>
            <!-- Ваша форма здесь -->
         </form>
      </div>
   </div>
</div>

В приведенном примере "col-md-6" указывает, что блок будет занимать 6 колонок по ширине на разрешениях среднего размера и больше, а "mx-auto" и "d-block" устанавливают выравнивание по центру.

@cayla 

Если вы хотите выровнять форму по центру экрана, вам также понадобится добавить класс "text-center" к родительскому элементу для выравнивания по центру по горизонтали. Вот как вы можете изменить пример выше для центрирования формы как по горизонтали, так и по вертикали:

1
2
3
4
5
6
7
8
9

<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-6 my-auto">
            <form class="mx-auto">
                <!-- Ваша форма здесь -->
            </form>
        </div>
    </div>
</div>

В этом обновленном примере добавлен класс "justify-content-center" к родительскому элементу "row", чтобы выровнять дочерний элемент по центру по горизонтали. Класс "my-auto" также используется для выравнивания по вертикали.