降低宽度 % 允许居中表单？答案

【问题标题】：lowering width % allows centering a form?降低宽度 % 允许居中表单？
【发布时间】：2012-01-12 04:26:10
【问题描述】：

太奇怪了，我无法修复它以使其居中...最后我尝试了不同的宽度 % 并得出结论，减少 % 可以使其居中....但它似乎倒退了。 ...有人能解释一下为什么这样做....我的意思是我让它起作用了，但我不想在我的大脑中烧掉这种技术，如果它只是巧合或其他什么......请解释一下p>

HTML 代码

 <form action="mailto:info@saucysbulldogs.com" method="post">
            <input type="text" id="fName" maxlength="20" size="30" placeholder="First Name" required="required" autocomplete="on"><br />
            <input type="text" id="lName" maxlength="20" size="30" placeholder="Last Name" required="required" autocomplete="on"><br />
            <input type="email" id="email" maxlength="30" size="30" placeholder="Email" required="required" autocomplete="on"><br />
            <textarea name="message" rows="5" cols="30" maxlength="100" wrap="hard" placeholder="Message..." required="required" /></textarea></p>
            <input type="submit" name="submit" value="Submit" />
            <input type="reset" name="clear" value="Clear" />
           </form>
</body>     
</html>

这是表单的 css 代码....我尝试了 100%，但没有成功...最后不得不降低到 25% 以使其居中....您可以看到在 www.saucysbulldogs.com

form {
padding:10px;
width:25%;
margin-left:auto;
margin-right:auto;  
}

谢谢

【问题讨论】：

标签： html css forms

【解决方案1】：

您不能将宽度为 100% 的元素居中，这对您来说应该很清楚。当您将百分比保持在较低水平且边距为 0 时，它会自动居中。

但没有必要降至 25%。

当我查看您的网址时，我发现没有问题。您的表单宽度为 85%，并在其父容器中居中。

【讨论】：