Bootstrap placing forms next to eachother - html

Question

Trying to put three of my first forms in the center of the container and put the last two forms next to the first three. Trying to use float, but that didn't work.
Any help is much appricieted:
bootply: http://www.bootply.com/125841
How I want it to look:

Answer 1

Ok.
you put everything inside a div with class="everything".
.everything {
overflow: auto;
width: 600px;
margin-left:auto;
margin-right:auto;
}
then you put the first three group of textfields in a class called .blocks and the other three groups of textfields and button in another div called .blocks too.
.blocks {
width: 50%;
float:left;
}
here you are fella:
<div class="jumbotron">
<div class="container">
<div class="row">
<div class="col-lg-12">
<form class="form-horizontal" role="form">
<div class="block">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">Email</label>
<div class="col-sm-2">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password</label>
<div class="col-sm-2">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password1</label>
<div class="col-sm-2">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
</div>
<div class="block">
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password2</label>
<div class="col-sm-2">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password3</label>
<div class="col-sm-2">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-4">
<button id="onlyButton" type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
css:
.jumbotron {
/* display: inline-block; */
margin-bottom: auto;
margin: 0 auto;
min-height: 623px;
}
.block {
width: 50%;
float: left;
}
.container {
min-height: 530px;
/* set border styling */
border-color: black;
border-style: solid;
border-width: 1px;
width: 600px;
margin-right:auto;
margin-left:auto;
overflow:auto;
/* set border roundness */
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
margin: 0 auto;
width: 800px;
/* display: inline-block; */
background-color: white;
}
.form-horizontal {
padding-right: 150px;
}
.form-control {
width: 100px;
margin-left: 30px;
}
#onlyButton {
float:right;
}