如何在頁面中心添加註冊表單並使其響應？

Question

我是新手自舉。我希望我的註冊表格在網頁的中心，它應該是敏捷的。請告訴我，如何使其響應......在此先感謝。

這裏是我的代碼：

<div class="container"> 
    <!-- Begin Registration Form--> 
    <form action="fillinfo.html" method="post" class="form-horizontal" role="form" name="register" id="registerform"> 
<div class="form-group"> 
     <label class="control-label col-xs-4" for="salutation">Salutation </label> 
     <div class="col-xs-4"> 
     <!--<input type="salutation" class="form-control sharp" id="salutation" name="salutation">--> 
     <select type="text" class="form-control sharp input-xlarge" title="Select an option" id="salutation" name="salutation"> 
           <option value="">Please Select</option> 
           <option value="1">Dear Sir</option> 
           <option value="2">Dear Madam</option> 
     </select> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

     <div class="form-group"> 
     <label class="control-label col-xs-4" for="pwd">First Name </label> 
     <div class="col-xs-4">   
      <input type="text" class="form-control sharp input-xlarge" title="Enter Your first name" id="fname" name="fname"> 
     </div><!-- End col-xs-4--> 
     </div><!-- End form-group--> 

    <div class = "form-group"> 
     <label class="control-label col-xs-4" for="pwd">Middle Name </label> 
     <div class="col-xs-4">   
     <input type="text" class="form-control sharp input-xlarge" title="Enter Your middle name (optional)" id="mname" name="mname"> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

    <div class="form-group"> 
     <label class="control-label col-xs-4" for="pwd">Last Name </label> 
     <div class="col-xs-4">   
     <input type="text" class="form-control sharp input-xlarge" title="Enter Your last name" id="lname" name="lname"> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

    <div class="form-group"> 
     <label class="control-label col-xs-4" for="pwd">E-mail </label> 
     <div class="col-xs-4">   
     <input type="mail" class="form-control sharp input-xlarge" title="Enter a valid email address" id="email" name="email"> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

    <div class="form-group"> 
     <label class="control-label col-xs-4" for="pwd">Password </label> 
     <div class="col-xs-4">   
     <input type="password" class="form-control sharp" title="Enter Password" id="password" name="password"> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

    <div class="form-group"> 
     <label class="control-label col-xs-4" for="pwd">Confirm Password </label> 
     <div class="col-xs-4">   
     <input type="password" class="form-control sharp" title="Confirm Password" id="cpassword" name="cpassword"> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

    <div class="form-group"> 
     <label class="control-label col-xs-4 " for="pwd">Mobile Number </label> 
     <div class="col-xs-4">   
     <input type="text" class="form-control sharp" title="Enter your 10 digit mobile no" id="mobile" name="mobile"> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 

    <div class="form-group">   
     <div class="col-xs-offset-4 col-xs-4"> 
     <div title="Agree our terms and conditions" class="checkbox"> 
      <input type="checkbox" name="checkbox" id="checkbox" value="check"> I have read, Understood, and agreed to the <a style="color:#1A292E" href="terms.html">Terms of Use</a> and the <a style="color:#1A292E" href="privacy.html">Privacy Policy</a> 
     </div> 
     </div><!-- End col-xs-4--> 
    </div><!-- End form-group--> 
</div><!-- End Container--> 

在這裏，我不能讓我的註冊按鈕爲響應..

<div class="container"> 
    <!-- Register modal with a button --> 
    <button style="background: #042a36" type="button" class=" col-xs-offset-4 col-xs-4 btn btn-info btn-lg sharp" title="Click to register" data-toggle="modal" data-target="#myModal" id="registerbtn">Register</button> 

Answer 1

嘗試使用塊級別按鈕，佔用了100％其父母的寬度，並把它放在網格列，例如：

<div class="row"> 
    <div class="col-xs-offset-4 col-xs-4"> 
     <button style="background: #042a36" type="button" class="btn btn-info btn-lg btn-block sharp" title="Click to register" data-toggle="modal" data-target="#myModal" id="registerbtn">Register</button> 
    </di> 
</div>