PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

How to align the form on the page?

  1. pcohen15
    Member

    Hi: I am new to Gravity Forms, and it's perfect for what I need to do. Great product. I am wondering if there's a way to specify the alignment of the form on the page -- left, right, center -- that type of alignment. I have created a form on this page: http://capitolcollegiate.org/contact/ and would like to move it to be left-aligned, or at least more to the left than where it currently sits. I am using the Agency child theme for StudioPress' Genesis platform. Thanks in advance for your help.
    Regards,
    Peter

    Posted 8 years ago on Friday August 27, 2010 | Permalink
  2. gmcalp
    Member

    check out this page in the documentation:

    http://www.gravityhelp.com/documentation/visual-css-guide/

    Posted 8 years ago on Friday August 27, 2010 | Permalink
  3. pcohen15
    Member

    gmcalp: Thank you. That guide assumes I know more about CSS than I do. I'm pretty good at following instructions, so if you could write something like, "In the style sheet for your theme, find this code and change that value ... " I'm sure the answer to moving the entire form to the left side of the page is in that guide somewhere, I just don't speak the language ;-)

    But I downloaded it anyway as a reference.

    Posted 8 years ago on Friday August 27, 2010 | Permalink
  4. gmcalp
    Member

    A great reference to learn more about CSS is:

    http://www.w3schools.com

    I use that a lot when I can't figure something out in PHP, CSS or HTML.

    Now, as far as the element name that you will need to look for and put in your style.css is this (from the CSS Styling section of the Documentation):

    All element ID’s are based on the unique form ID and then a field ID. For example: #gform_wrapper_xx where “xx” is the form ID or #field_xx_yyy where “xx” is the form ID and “yyy” is the field ID.

    If you are using Firefox, on the form page you can press Ctrl+U to view the page source (I think in IE it's View>Source) and look for the:

    <div class="gform_wrapper" id="gform_wrapper_xx....>

    (it's the ID section you'll want to put into your theme's style.css) and use the W3Schools website to figure out the CSS rules you'll need to move things around.

    Posted 8 years ago on Saturday August 28, 2010 | Permalink
  5. The link for help on this page is dead. http://www.gravityhelp.com/documentation/visual-css-guide/

    Posted 7 years ago on Thursday June 16, 2011 | Permalink
  6. Here's the current link.

    http://www.gravityhelp.com/resources/cssguide/css_guide.html

    I'll look into why my redirect isn't working. Thanks For the heads up.

    Posted 7 years ago on Thursday June 16, 2011 | Permalink