<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <form> <div class="container login col-md-5"> <div class="row"> <div class="loginform col-md-8"> <h3>MEMBER LOGIN</h3> <div class="email col-md-12"> <input type="text" placeholder="Email" class="emailbox col-md-12"> </div> <div class="password col-md-12"> <input type="password" placeholder="Password" class="passwordbox col-md-12"> </div> <div class="submit col-md-12"> <input type="submit" class="submitbtn col-md-12"> </div> <div class="forgot pull-left"> <label> <input type="checkbox"> Remember Me</label> </div> <div class="forgot"> <a href="#">Forgot Password?</a> </div> </div> </div> </div> </form>

.login{ height: 60%; } .loginform{ text-align: center; border: 1px solid; height: 60%; position: relative; background-color: #035379; } .royal{ width: 80%; } input{ margin-bottom:2%; } .forgot{ position: relative; left: 6%; } .forgot a{ color: black; } .forgot a:hover{ color: red; text-decoration: none; cursor: help; }