Как сделать форму по центру в bootstrap?

Пользователь

от lori_jast , в категории: HTML/CSS , год назад

Как сделать форму по центру в bootstrap?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от hattie , год назад

@lori_jast 

В Bootstrap 4 можно центрировать форму, используя классы "d-flex" и "align-items-center". Например:

1
2
3
4
5
<div class="d-flex align-items-center" style="height: 100vh;">
  <form>
    ...
  </form>
</div>


Вы можете также использовать класс "mx-auto" для центрирования формы по горизонтали:

1
2
3
4
5
<div class="d-flex align-items-center" style="height: 100vh;">
  <form class="mx-auto">
    ...
  </form>
</div>


Пользователь

от cayla , год назад

@lori_jast 

Вы можете центрировать форму в Bootstrap, используя класс d-flex и свойство align-items-center:

1
2
3
4
5
<div class="d-flex align-items-center h-100">
  <form>
    <!-- your form content here -->
  </form>
</div>


Это заставит форму выровняться по центру по вертикали, в то время как h-100 заставит родительский блок занимать всю высоту родителя.