View Full Version : Center a form but not the contents

09-11-2011, 01:13 AM

I have the following form:

<form action="#" method="get">
<legend>Date Range</legend>
<label for="startdate">
<span>Start Date:</span>
<input type="text" name="startdate" id="from"
maxlength="20" />

<label for="enddate">
<span>End Date:</span>
<input type="text" name="enddate" id="to"
maxlength="20" />
<center><input value="Create Report" type="submit"></center>

And I want to center the form on the screen but I don't want to center all the contents of the form.

I have tried <Div align=center> but this centers everything.

I have css code:

fieldset {margin: 1em 5px; padding: 10px 10px; width: 170px;}
legend {padding: 0.2em 0.5em; color:green; font-size:120%; text-align:left;}

for the fieldset and I want the legend to stay to the left side, but everytime I try css in DIVs I always end up centering everything.

Any help would be greatfully received.


09-11-2011, 01:55 AM
just use a margin on the Div like this...

div { margin: 0 auto; }

09-11-2011, 11:25 PM
That didn't seem to work??

Here is the script on the page:


Can you see what I may be doing wrong?

Thanks in advance

09-12-2011, 12:56 AM
Benzen I just checked your website and your form is centered.
If you're talking about the fieldset which is aligned to the left you should change:

fieldset {margin: 1em 5px;}

fieldset {margin: 1em auto;}