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.

Unnecessary bullets not responding to css fix

  1. SophiaKelly
    Member

    Hi there,
    I now have a form up and it seems to be inserting bullets in front of each item.
    After reading this: http://www.gravityhelp.com/question/why-is-my-form-showing-up-with-list-bullets/
    I’ve tried adding the following to the css:

    [css]
    body .gform_wrapper form .gform_body ul,
    body .gform_wrapper form .gform_body ul li {
    	    list-style-type:none!important;
    	    list-style-image:none!important;
    	    list-style:none!important;
    	    background-image:none!important;
    	    background:none!important;
    	    padding:0!important;
    	    margin:0!important
    	}

    (I’ve also tried it with the ‘!important’ comment removed. from each line, retaining the ';' character)

    I’ve also tried turning on and off the css output in the forms settings.

    Here’s the page with the form:
    http://www.bcss.org/2011/11/e-newsletters/tell-us-your-story/

    My css doesn't use images for bullets, or have other list-type styling that should conflict.

    Any suggestions?
    Sincerely,
    Sophia

    Posted 9 years ago on Tuesday November 15, 2011 | Permalink
  2. Two things. First, your default forms stylesheet isn't being loaded. Most likely, if you enable that you won't see the default bullet styles. Go to your main form settings page ( FORMS > SETTINGS ) and make sure the "output CSS" option is enabled.

    Secondly, I don't know where you put your custom CSS rules, but they're not being applied on this page. Make sure that you're putting your CSS rules in a stylesheet that gets loaded on the page. This varies a lot per theme so if you're not sure, you may want to contact your theme developer for guidance on where to put custom CSS.

    EDIT: I did a quick test on my end and enabled the default forms.css file for your form. As expected, the bullets went away just by doing that.

    screenshot: http://i.imgur.com/Ff7cs.png

    I do see some potential other layout issues due to style inheritance from your theme CSS, but that's another issue entirely. If you need help with other issues, please start a new thread for that.

    Thanks.

    Posted 9 years ago on Tuesday November 15, 2011 | Permalink
  3. SophiaKelly
    Member

    Thanks, I'll have a look.

    Posted 9 years ago on Tuesday November 15, 2011 | Permalink
  4. Please let us know if you're able to resolve the issue or if you need additional assistance.

    Posted 9 years ago on Wednesday November 16, 2011 | Permalink
  5. I had this same issue with conflicting styles and found the snippet above for adding some clearing styles and that still didn't fix my problem. After digging around for quite some time, I read an obscure reference to the location of the forms.css file. While I had enabled the plugin to output the form CSS, it wasn't working (I suspect this is because I have a custom theme with nested folders). I started to manually reference the style sheet by editing the PHP and then realized it just didn't need to be that difficult. I simply made a copy of the forms.css file and manually uploaded it into the same folder as stye.css and everything worked perfectly. I hope this post will save someone else the laborious digging...

    Posted 9 years ago on Saturday December 10, 2011 | Permalink
  6. Thank you for posting your work around.

    Posted 9 years ago on Sunday December 11, 2011 | Permalink

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