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.

Alignment Problems CSS Ready Class - 1.5RC4.2

  1. Do you have any suggestion as to how I can resolve the issue with the form fields being staggered.

    In the form preview everything lines up correctly but when lI ook at the actual page field do not form side by side.

    http://www.rcgauto.com/about-rcg/create-an-order/

    Thanks

    Posted 9 years ago on Friday March 18, 2011 | Permalink
  2. If it works fine in the form preview and not in the page itself, then it's a style issue coming from your theme. The form is inheriting a padding property from line 1405 of your themes style.css file.

    [css]
    .entry ul li {
        list-style-type: none;
        padding: 3px 0 3px 10px;
    }

    You can try to override that by using some CSS inheritance. Try adding this to the end of your themes style.css file. It worked fine in my test.

    [css]
    body .entry .gform_wrapper .gform_body ul.gform_fields li.gfield {padding:0}

    screenshot: http://grab.by/9xJ1

    Posted 9 years ago on Friday March 18, 2011 | Permalink
  3. Awesome - it worked perfectly, thank you !

    Do you have any idea how to remove the 2 lines underneath the form Title and above the multiple choice field ?

    Posted 9 years ago on Friday March 18, 2011 | Permalink
  4. Yep, the UL is inheriting a border property from line 288 of the style.css file. Try adding this to whip it into submission.

    [css]
    body .entry .gform_wrapper .gform_body ul {border:none}
    Posted 9 years ago on Friday March 18, 2011 | Permalink
  5. Epic customer service - Thanks, no more questions for now

    Posted 9 years ago on Friday March 18, 2011 | Permalink
  6. My pleasure. Have a great morning.

    Posted 9 years ago on Friday March 18, 2011 | Permalink
  7. Emerson
    Member

    Hi, I tried this fix for a page that I am working on. However, I did not work for me. Can you please let me know what I should do?

    http://rosariogsicuranza.claimyourleads.info/case-review-evaluation-form

    Posted 9 years ago on Friday April 1, 2011 | Permalink
  8. The snippet above didn't work for you because your markup isn't structured the same. Your problem is a blanket CSS padding & margin rule applied to all list items by your theme (see line 96 & 98 of your style.css file). If that's disabled, you'll notice that the form layout works as intended.

    screenshot: http://grab.by/9MCM

    Try adding this to the end of your theme stylesheet. It should override the previous rules and reset everything for you.

    [css]
    body .gform_wrapper ul li {margin:0; padding:0}
    Posted 9 years ago on Friday April 1, 2011 | Permalink
  9. Emerson
    Member

    That snippet worked; thank you. Another things is, there seems to be some extra spacing in the columns. What can I do to control this?

    Posted 9 years ago on Friday April 1, 2011 | Permalink
  10. Emerson
    Member

    I think I was able to fix it by using:

    [css]
    body #gform_wrapper_1 {width:500px; margin:10px auto;}
    Posted 9 years ago on Friday April 1, 2011 | Permalink
  11. Okay, cool. Thanks for the updates.

    Posted 9 years ago on Friday April 1, 2011 | Permalink

This topic has been resolved and has been closed to new replies.