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.

Text Overlapping Radio Buttons-Check Boxes

  1. Hi, I have been working with Gravity Forms now for a couple weeks. I am having some difficulty getting the radio buttons and the text to not overlap. I have the same form on two different websites here: http://bhrt.me/quality-of-life-assessment/ the text overlaps the radio button. On this site here: http://hghinjectable.org/contact-us/quality-of-life-assesment/ the spacing is just fine. I am not very strong in css and do not really know where to start to resolve this issue. Any assistance someone can provide would be greatly appreciated.

    Thanks

    Posted 12 years ago on Sunday October 2, 2011 | Permalink
  2. You have '.gform_wrapper .gfield_radio li label {display:block; margin: 0 0 0 24px; padding:0; width: auto; line-height:1.5; vertical-align: top } in your http://bhrt.me/wp-content/plugins/gravityforms/css/forms.css?ver=3.2.1 that is causing this.

    Remove the padding:0; and the form displays correctly.

    Can't guarantee it won't mess up your themes somewhere else though

    Posted 12 years ago on Sunday October 2, 2011 | Permalink
  3. No, I wouldn't remove anything from the default forms stylesheet. It usually works just fine. I'm sure there's something else at work in your theme. Does the form in question look okay in the form preview page.. if so, then it's your theme for sure.

    I can't see your site because of a database error or I would be able to tell you a little better what it is.

    screenshot: http://bit.ly/oMwbzn

    Posted 12 years ago on Monday October 3, 2011 | Permalink
  4. Hi Scott, I tried the suggested edit and so far everything works ok so far. Customer no longer complaining so that's perfect for me.

    Kevin I would be open to looking at other alternatives. Scotts suggestion worked but if this is a bad idea and there is a better solution I would try it also.

    The database connection error I would have to blame on the Webhost. The customer is using their preferred Host and from time to time I see odd stuff like connection errors or the site just goes down all together. Client is making their own bed there.

    Thanks again fellas for the feed back :)

    Posted 12 years ago on Monday October 3, 2011 | Permalink
  5. I should explain better - Kevin is right, it is bad form to edit the default sheet. When I say to remove it I actually mean to use another css file to override css styles - otherwise your changes may be lost if you upgrade a theme or plugin at a later date,

    Most themes support a custom.css in the theme directory that loads last - if you put any overrides there it will apply them to the site even if there is an update, and won't risk a change that messes up your back-end.

    This is just a workaround and not the best way to handle it - the correct way is to determine what CSS is changing the default action of a list item on your site, but by my count there are 19 css files loading on that page with 483 entries for 'padding' - it may take a while for you to track it down.

    Posted 12 years ago on Monday October 3, 2011 | Permalink