I read that you can use the css property margin: auto auto; to align content in the center of its container. I have the following structure:
<div id="main">
<form>
<input id="deployment_name" type="hidden" />
<input id="return_url" name="return_url" type="hidden" />
<div class='field'>
<label for="email">Email</label>
<input id="email" name="email" type="text" />
So what I want to do is align the label and the input field in the center of the main container. However, when I try this:
#main input, #main label {
margin: 0 auto;
}

It does not center the lable and input field in the center of the container. Thanks for any response.

Excavator

05-07-2010, 02:17 AM

Hello johnmerlino,
I'm not much of a form guy but to center an block level element you need three things:

a DocType Declaration
an element with a width
that elements left/right margins set to auto

So, using the rules listed above, when you give .field a width you are then able to center it with margin: 0 auto;