无法将Div中的输入元素居中

Question

我尝试使用谷歌搜索，但没有帮助，大多数人提供解决方案 margin：auto 并且还有几个关于stackoverflow的问题同样的问题大多数都有答案作为保证金：auto我正在应用相同的解决方案对我不起作用

HTML

<div id="content" class="lcard">
    <center>
    <h1 class="n">Sign in To your<br> Crawler Account</h1><br>

<form onsubmit="return validateForm()" method="post">

    <center><input name="Email" required type="email" placeholder="Email">

    <input name="Password" required type="Password" placeholder="Password" >

    <button type="submit"  class="b"><b>Sign In</b></button>
</center>

    <p id="reg" ><a href="C:/lcrawl/register.html" >New User Please Register</a></p>
</form>
 </div>

CSS

.lcard
{
    background-color:#EEEEEE;
    height:400px;
    width:400px;
    margin:left;

}
.n
{
    margin-bottom:50;
    left:-50%;
}
input
{
    padding: 5 10px;
    width:274px;
    height:44px;

    margin:auto;

}

.b
{
    border: 1px solid;
    background-color:#3079ed;
    width:274px;
    height:44px;
    margin:auto;
}

Answer 1

为什么你要留下保证金？

.lcard
{
    background-color:#EEEEEE;
    height:400px;
    width:400px;
    margin:left;

}

Answer 2

我注意到的第一件事是保证金：左，我不确定它是否真实值。

您还应该检查输入元素中的属性。类型和其他值看起来很奇怪，首先尝试使用它们，然后尝试在CSS值中使用输入[type =“text”] 和输入[type =“submit”]，而不只是**输入。

Answer 3

在调用内容

时，将中心标记放在第一个div之前

    <div id="content" class="lcard">
    <center>
    <h1 class="n">Sign in To your<br> Crawler Account</h1><br>

    <form onsubmit="return validateForm()" method="post">

    <center><input name="Email" required type="email" placeholder="Email">

    <input name="Password" required type="Password" placeholder="Password" >

    <button type="submit"  class="b"><b>Sign In</b></button>
    </center>

    <p id="reg" ><a href="C:/lcrawl/register.html" >New User Please Register</a></p>
    </form>
    </div>

应该......

    <center>
    <div id="content" class="lcard">

    <h1 class="n">Sign in To your<br> Crawler Account</h1><br>

    <form onsubmit="return validateForm()" method="post">

    <center><input name="Email" required type="email" placeholder="Email">

    <input name="Password" required type="Password" placeholder="Password" >

    <button type="submit"  class="b"><b>Sign In</b></button>


    <p id="reg" ><a href="C:/lcrawl/register.html" >New User Please Register</a></p>
    </form>
    </div>
    </center>

Answer 4

首先，删除OLD OLD center块，而不是仅将text-align: center应用于表单和标头。 JSFiddle

.n
{
    text-align: center;
}

Answer 5

我改变了你的css一点

 .lcard
{
    background-color:#EEEEEE;
    height:400px;
    width:400px;
    margin-left: auto;
    margin-right: auto;

}

现在它在我的电脑上工作了。

Answer 6

您的代码没有错误

Here is jsfiddle, with your code plus minor modification

http://jsfiddle.net/Lb6mm/2/