My Question is, how to center the complete form (input fields with labels) in the modal.
Here is also the fiddle: http://jsfiddle.net/beernd/reh0ookq/
but the snippet here should also work.
<script src=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js></script>
<link href=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css rel=stylesheet/>
<script src=https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js></script>
<form name=useradd class=form-horizontal role=form method=post>
<div class=modal show id=useradd_modal>
<div class=modal-dialog modal-lg>
<div class=modal-content>
<div class=modal-header>
<button type=button class=close data-dismiss=modal><span aria-hidden=true>×</span><span class=sr-only>Close</span></button>
<h4 class=modal-title text-center text-danger>Adding a user</h4>
</div><!-- /.modal-header -->
<div class=modal-body>
<div class=form-group>
<label class=col-sm-2 col-md-2 control-label>Login-Name:</label>
<div class=col-sm-4 col-md-4>
<input class=form-control type=text placeholder=Login-Name value= name=ua_loginname required=required />
</div>
</div>
<div class=form-group>
<label class=col-sm-2 col-md-2 control-label>Firstname:</label>
<div class=col-sm-3 col-md-3>
<input class=form-control type=text placeholder=Firstname value= name=ua_fname required=required/>
</div>
</div>
</div><!-- /.modal-body -->
<div class=modal-footer>
<input class=btn btn-md btn-danger pull-left data-dismiss=modal type=submit value=User add/>
<button type=button class=btn btn-default data-dismiss=modal>Close</button>
</div><!-- /.modal-footer -->
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</form>
I've tried many other solutions like adding
style=text-align: center;
and adding to the inputs style=margin 0 auto;
Like this
or added an id with display: inline-block;
and class with text-align: center
but all other solutions didn't worked for me.