Bootstrap Centre d'aligner une div horizontalement

J'ai essayé de simple page de connexion pour un échantillon. Mais je suis incapable d'aligner les champs de centre. h:commandButton est aligné au centre. mais le repos des champs n'ont pas de changement, tout en garder <div align="center">

Comment faire pour garder leur centre alignés?

<div align="center">            
    <h:message for="btnSubmit"/>
    <div class='form-row'>
        <div class='col-xs-2 form-group required'>
         <label class='control-label'> User Name </label>
          <h:inputText styleClass="form-control" size="12" maxlength="20" 
                       id="userName" value="#{loginController.userName}" 
                       required="true"/>
        </div>
    </div>

    <div class='form-row'>
        <div class='col-xs-2 form-group card required'>
           <label class='control-label'>Password</label>
           <h:inputText styleClass="form-control" size="12" maxlength="20"
                        id="password" value="#{loginController.password}"
                        required="true" />
         </div>
    </div>

    <div class='form-row'>
        div class='col-md-12 form-group'>
      <h:commandButton styleClass="btn btn-success" 
               value="#{bundle['label.Login']}" id="btnSubmit" 
               action="#{loginController.clientLoginAction}"/>
        </div>
    </div>
</div>
Si vous ajoutez un violon jsfiddle.net) vous aurez de chance d'obtenir une réponse encore plus rapide!

OriginalL'auteur Teja Maridu | 2014-01-06