无法在 div 内居中输入字段答案

【问题标题】：can not center input fields inside div无法在 div 内居中输入字段
【发布时间】：2015-06-24 14:16:57
【问题描述】：

我正在尝试使我的表格居中，但即使尝试了所有可能的方式，我也无法实现它。

.content {
  margin: 0 auto;
  padding: 0 1em;
  max-width: 768px;
  text-align: center;
}

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>::Members Area::</title>
    <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/pure/0.4.2/pure-min.css">
  </head>
  <body>
    <div class="page-wrap">
      <div class="header">
        <h1>heading</h1>
        <h2 id="msg">Heading</h2>
      </div>
      <div class="content">
        <form class="pure-form" action="" method="post" id='loginform'>
          <div class="fields">
            <fieldset class="pure-group center" >
              <input type="text" required autofocus class="pure-input-1-2" value="" name="username" id="username" placeholder="Username">
              <input type="password" required class="pure-input-1-2" name="password" id="password" placeholder="Password">
              <input type="email" class="pure-input-1-2" value="" name="email" id="email" placeholder="Email">
              <input type="hidden" name="type" value="login" id="type">
            </fieldset>
          </div>
          <button type="submit" class="pure-button pure-input-1-2 pure-button-primary" name="loginbutton" id="button" value="login">Sign in</button>
          <div class="login-links"> 
            <a href="#" id="forgt">Forgot password ?</a>
            <a href="#" id="signin">Already have an account ?  <strong>Sign in</strong></a>
            <br />
            <a href="#" id="signup">Don't have an account ? <strong>Sign Up</strong></a>
          </div>   
        </form>
      </div>
    </div>
  </body>
</html>

字段中的文本和按钮居中但输入字段未居中.

【问题讨论】：

标签： html css css-position centering

【解决方案1】：

将.pure-form .pure-group input 设置为display: inline-block 而不是pure-min.css 中的display: block

或者只是在另一个样式表中覆盖它：

.pure-form .pure-group input{
   display: inline-block;
}

FIDDLE

【讨论】：

您能否提供一些其他解决方案，因为我正在使用 CDN 进行纯 CSS，并且不想在自托管后对其进行修改。
@raghuv 你能像我在小提琴中那样尝试覆盖它吗？