<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 ----------> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> <div class="containter"> <div class="signup col-md-12 col-xs-12 text-center" > <form action="" method="" id="signfrm" > <h3 class="sign-h"><span id="sign-icon"><i class="fa fa-sign-in"></i></span>Sign Up!</h3> <input type="text" class="form-control" id="sign-frm-input" placeholder="enter Your First Name"> <input type="text" class="form-control" id="sign-frm-input" placeholder="enter Your Last Name"> <input type="text" class="form-control" id="sign-frm-input" placeholder="enter Your Mobile Number"> <input type="text" class="form-control" id="sign-frm-input" placeholder="enter Your Email ID"> <input type="password" class="form-control" id="sign-frm-input" placeholder="Creat Your Password"> <button type="submit" class="btn btn-primary" id="sign-frm-input-btn">Submit</button> </form> </div> </div>

#signfrm { margin:5% auto; width: 25%; border: 1px solid #ccc; border-radius: 20px; padding: 20px; } #sign-frm-input { margin-bottom: 10px; } .sign-h{ text-align:left; color:#317EAC; } #sign-icon{ margin-right:5px; color:#317EAC; } #sign-frm-input-btn { width: 50%; margin: auto; font-size: 20; padding: 5px !important; }