jqWidgets窗体水平对齐

Question

如何使jqWidgets表单与水平对齐?我尝试的是:

<style>
input {
   display: inline-block;
}

Answer 1

那张怎么样:http://jsfiddle.net/dbZJL/

 $('#testForm').jqxValidator({
     rules: [
     {
         input: '#userInput',
         message: 'Username is required!',
         action: 'blur',
         rule: 'required'
     },
     {
         input: '#emailInput',
         message: 'Invalid e-mail!',
         action: 'blur',
         rule: 'email'
     }],
 });
 $("#jqxbutton").jqxButton({
     theme: 'energyblue',
     width: 100,
     height: 30
 });
 $("#jqxbutton").click(function () {
     $('#testForm').jqxValidator('validate');
 });
<form id="testForm" action="./">Username:
    <input type="text" id="userInput" class="text-input" />E-mail:
    <input type="text" id="emailInput" class="text-input" />
    <input type="button" style="" id="jqxbutton" value="Submit" />
</form>

通过应用CSS边距，你可以改变表单的对齐方式。要更改表单内容的对齐方式，可以设置左填充或右填充。例如:http://jsfiddle.net/t76Jc/

Answer 2

可以选择不同的对齐方式

我希望这样的事情可以帮助你:

input {
   display: block;
   width: 100px;
   margin: 0px auto;
}

或者你可以把它放到<center>标签中:

<center>
  <form>
    <input type="text" />
  </form>
</center>

演示