<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 ----------> <div class="container"> <br> </div> <div class="container"> <div class="row"> <div class="col-md-8"> <div class="jumbotron"> <h1>Start Here</h1> <p>Example launch page form for Bootstrap 3. Use this as a starting point to create something more unique.</p> <p><a href="http://bootply.com" class="btn btn-primary btn-lg">Learn More <i class="glyphicon glyphicon-chevron-right"></i></a> </p> </div> </div> <div class="col-md-4"> <h2>Sign Up</h2> <hr> <form class="form-horizontal" role="form"> <div class="form-group"> <label for="inputEmail1" class="col-md-3 control-label">Email</label> <div class="col-md-9"> <input class="form-control" id="inputEmail1" placeholder="Email" type="email"> </div> </div> <div class="form-group"> <label for="inputPassword1" class="col-md-3 control-label">Password</label> <div class="col-md-9"> <input class="form-control" id="inputPassword1" placeholder="Password" type="password"> </div> </div> <div class="form-group"> <label for="inputPassword1" class="col-md-3 control-label">Verify</label> <div class="col-md-9"> <input class="form-control" id="inputPassword2" placeholder="Password (again)" type="password"> </div> </div> <div class="form-group"> <div class="col-md-offset-3 col-md-9"> <div class="checkbox"> <label> <input type="checkbox"> I agree with the <a data-toggle="modal" href="#tcModal">Terms and Conditions</a> </label> </div> </div> </div> <div class="form-group"> <div class="col-md-offset-3 col-md-9"> <button type="submit" class="btn btn-inverse">Sign in</button> </div> </div> </form> </div> </div> </div> <!-- Modal --> <div class="modal fade" id="tcModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">Terms and Conditions</h4> </div> <div class="modal-body"> Blah blah. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan. Aliquam in felis sit amet augue. </div> <div class="modal-footer"> <button type="button" class="btn btn-primary" data-dismiss="modal">I Agree</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->