[Inori]

You should use Flexbox. You'll have to clean the code up yourself, but this achieves what you want.

Code:

.form {
 display: flex;
 flex-flow: row wrap;
 justify-content: space-around;
 width: 50em;
 margin: auto;
}

.vhr {
 width: .2em;
 background-color: #5d5d5d;
}

.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;
}

Code:

<link rel="stylesheet" href="index.css">

<div class="form">

<div>
<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 class="vhr">
</div>
<div>
<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>
</div>

Careful with flexbox. It's technically stable, but very far from cross-compatible. Your best (ie9-compatible) bet would be to use a wrapper div that fills its parent, then center the form inside it with margins.