<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="//cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3"> <h2>Sign in or Sign up</h2> <ul class="nav nav-tabs"> <li class="active"><a data-toggle="tab" href="#signin">Sign in</a></li> <li><a data-toggle="tab" href="#signup">Sign up</a></li> </ul> <div class="tab-content"> <div id="signin" class="tab-pane fade in active"> <h3>SIGN IN</h3> <form role="Form" method="POST" action="" accept-charset="UTF-8"> <div class="form-group"> <input type="text" name="email" placeholder="Email..." class="form-control"> </div> <div class="form-group"> <input type="password" name="password" placeholder="Password..." class="form-control"> </div> <div class="form-group"> <label> <input type="checkbox" name="remember"> Remember me </label> </div> <div class="form-group"> <button type="submit" class="btn btn-default">Submit</button> </div> </form> </div> <div id="signup" class="tab-pane fade"> <h3>SIGN UP</h3> <p>You will receive an email to verify your account.</p> <form role="Form" method="POST" action="" accept-charset="UTF-8"> <div class="form-group"> <input type="text" name="email" placeholder="Email..." class="form-control"> </div> <div class="form-group"> <input type="password" name="password" placeholder="Password..." class="form-control"> </div> <div class="form-group"> <input type="password" name="password2" placeholder="Verify password..." class="form-control"> </div> <div class="form-group"> <button type="submit" class="btn btn-default">Submit</button> </div> </form> </div> </div> </div> </div> </div>