Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post Center a form but not the contents

    Hi,

    I have the following form:

    Code:
    <form action="#" method="get">
      <fieldset>
        <legend>Date Range</legend>
        <label for="startdate">
          <span>Start Date:</span>
          <input type="text" name="startdate" id="from" 
            maxlength="20" />
        </label>
        
        <label for="enddate">
          <span>End Date:</span>
          <input type="text" name="enddate" id="to" 
            maxlength="20" />
        </label>
      </fieldset>
      <fieldset>
      <center><input value="Create Report" type="submit"></center>
      </fieldset>
      </form>
    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:

    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.

    Ben

  • #2
    Mr.
    Mr. is offline
    Regular Coder
    Join Date
    Feb 2011
    Posts
    112
    Thanks
    8
    Thanked 4 Times in 4 Posts
    just use a margin on the Div like this...

    div { margin: 0 auto; }

  • #3
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That didn't seem to work??

    Here is the script on the page:

    http://www.jewelleryandgifts4u.co.uk/test/test.php

    Can you see what I may be doing wrong?

    Thanks in advance

  • #4
    Regular Coder
    Join Date
    Mar 2010
    Posts
    199
    Thanks
    78
    Thanked 5 Times in 5 Posts
    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:

    Code:
    fieldset {margin: 1em 5px;}
    To:
    Code:
    fieldset {margin: 1em auto;}


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •