How do I center a form within Jumbotron - Bootstrap 4

Question

I\'m completely new to Bootstrap so sorry if this is a silly question.

I am trying to center a form within a jumbotron: Everything in the jumbotron centers except th

Answer 1

Bootstrap has a class .center-block that can be used alongside a nested col-*-* sizing to center the form. The responsive col-*-* will help the form adjust based on screen size.

A set width could cause the form to flow out of the container at smaller screen size.

You will also need to remove the float:left; from the inner col-*-* which you can set via a class:

CSS:

.pull-none {
  float: none;
}

HTML:

You can also, use col-*-offset-* to center elements as well, here is an example setting the form to col-sm-6 and offsetting by 4 to center:

Here is a jsfiddle demonstrating the functionality.