margin-left: auto and margin-right: auto not working on input

In order for margin: 0 auto; to work, in addition to display:block a width needs to be specified.

In my case, it was float: left that I forgot about. So, make sure you apply float: none to your input field.

You already have display: block and margin: 0 auto, you just need to set width too.

Example that should work:

input{
     width:50% !important;
     margin:0 auto !important;
     display:block !important;
     float:none !important;
}

If that doesn't work try adding !important to the values or make sure your style is not overwritten by something else.

I found the solution for you

you should specify element width

input {
  display: block;
  width: 60px;
  margin: 10px auto;
  padding: 3px;
}

Related