уменьшение ширины% позволяет центрировать форму?

Question

совершенно странно, и я не мог исправить это так, чтобы он был отцентрирован ... в конце концов, я поиграл с другой шириной% и пришел к выводу, что уменьшение% позволило центрировать его ... но это кажется задом наперед. ... может кто-то просто объяснить, почему он это делает .... я имею в виду, я заставил его работать, но я не хочу записывать эту технику в моем мозгу, если это всего лишь совпадение или что-то подобное ... пожалуйста, объясните

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;  
}    

спасибо

Answer 1

То, что вы не можете центрировать элемент с шириной 100%, должно быть для вас вполне понятным. Когда вы сохраняете процент ниже и маржа на 0 автоматически, он центрируется.

Но нет необходимости снижаться до 25%.

Когда я смотрю на ваш URL, я не вижу проблем. Ваша форма там имеет ширину 85% и центрируется в родительском контейнере.