[prudruhuph]

i want to create a webpage with register form & login form are in parallel, by using float property i achieved that... but the problem is distance between forms..

currently it look like this
https://www.anonfiles.cc/uploads/fe112dc...bf3bd7.png

i want to make it look like this
https://www.anonfiles.cc/uploads/0f4328b...fcf6ec.png


CSS

Code:

#leftContainer {
   float:left;
}

#rightContainer {
float:right;
}

.form input{
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    background: #fff;
    margin-bottom: 4%;
    border: 1px solid #ccc;
    padding: 3%;
    color: #000;
    font: 95% Arial, Helvetica, sans-serif;
}
.form input:focus{
    box-shadow: 0 0 5px #43D1AF;
    padding: 3%;
    border: 1px solid #43D1AF;
}

.form input[type="submit"],.form input[type="button"]{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    padding: 3%;
    background: #43D1AF;
    border-bottom: 2px solid #30C29E;
    border-top-style: none;
    border-right-style: none;
    border-left-style: none;    
    color: #fff;
}
.form input[type="submit"]:hover,.form input[type="button"]:hover{
    background: #2EBC99;
}

HTML

Code:

<div class='form'>

<div id="leftContainer">
<h1>Register</h1>
<form action="/register.php" method="POST">
<input name="fname" type="text" placeholder="First Name"><input name="lname" type="text"placeholder="Last Name">
<br><input name="email" type="text" placeholder="Email"><br>
<input name="rollno" type="text" value="0818" placeholder="Enrollment Number"><br>
<input name="pass" type="pass" placeholder="Password"><br><br>
<input type="button" value="SUBMIT" name="register">

</form>
</div>





<div id="rightContainer">
<h1>Login</h1>
<form action="/check.php" method="POST">
<input name="rollno" type="text" value="0818"><br>
<input type="pass" name="pass"><br><br>
<input type="button" name="login" value="SUBMIT">
</form>
</div>