如何居中輸入文本框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？

回答

相關問題