如何居中输入文本框HTML？

我有一个表单，我想将文本框和标签居中放在中间。我怎样才能做到这一点？（我会认为对齐左右自动会做到这一点，但它不起作用）。这是我的代码：如何居中输入文本框HTML？

<body> 
    <div id="formWrapper"> 
      </center> 
      <form method ="post" action="addMember.php"> 
      <label for="name">Username:</label> 
      <input name="name"/> 
      <label for="password">Password:</label> 
      <input name="password"/> 
      <label for="email">Email:</label> 
      <input name="email"/> 
      <p> 
      <fieldset> 
      <input class="btn" name="submit" type="Submit" value="Register"/> 
      <input class="btn" name="reset" type="reset" value="Clear Form"> 
      </fieldset> 
     </form> 
    </div> 
</body>

风格：

#formWrapper{ 
    width:550px; 
    padding: 2em 0 2em 0; 
    border:solid 5px #F1F1F1; 
    margin-top: 100px; 
    margin-right: auto; 
    margin-bottom: 0; 
    margin-left: auto; 
    background-color: #AFC8DE; 
}

来源

2011-08-25 Spike Lee

'的text-align：center'为'＃DIV formWrapper'应该做它。 – adarshr

我之前尝试过，它没有工作，现在它似乎工作，谢谢：D。 –

如果您申请text-align: center到窗体，将放在中心的领域。

语义在这里很重要，所以看看形式的可访问的方法。 http://www.alistapart.com/articles/prettyaccessibleforms

来源

2011-08-25 09:51:33 Chris

在IE中它工作正常，但在谷歌浏览器我得到以下结果http://imageshack.us/photo/my-images/585/unledsie.png/，obv它不在中心，但我该如何解决它？ –

你可以发布你的代码吗？你可能会在某处填充填充。 – Chris

当然，继承人的CSS代码http://pastebin.com/Fuq5Qjqc –

看看这个：http://jsfiddle.net/7auS8/

来源

2011-08-25 09:51:55 kleinohad

border: 1px solid gray; 
    border-radius:5px; 
    color: #393939; 
    height: 30px; 
    padding: 0px 6px 0 6px; 
    width: 186px;

来源

2013-10-19 08:35:41

我把这个代码，并尝试了adarshr答案，它为中心的形式。克里斯也是正确的语义在这里非常重要，因为看到它后，我觉得这可能不是你正在寻找的。另一点我想补充一点，读这个可能是初学者的人是，当你添加文本对齐：中心;它需要进入css文件并以a结尾;

来源

2014-08-07 18:38:55 greb22

添加ALIGN = “中心”到窗体

div id="formWrapper"> 
     <form method ="post" action="addMember.php" align="center"> 
      <label for="name" >Username:</label> 
      <input name="name"/> 
      <p> 
      <label for="password">Password:</label> 
      <input name="password"/> 
      <p> 
      <label for="email">Email:</label> 
      <input name="email"/> 
      <p> 
      <fieldset> 
       <input class="btn" name="submit" type="Submit" value="Register"/> 
       <input class="btn" name="reset" type="reset" value="Clear Form"> 
      </fieldset> 
     </form> 
    </div>

来源

2017-05-05 04:03:23

如何居中输入文本框HTML？

回答

相关问题