Search code examples
csswordpresscheckboxgravity-forms-plugin

Why are my gravity form checkboxes and labels out of alignment?

I'm a gravity form newbie and I inherited this site from the previous web developer. I notice that my gravity form checkboxes are out of alignment and being placed above the labels.

I googled a few different CSS edits but none of them seem to work. The hardest part here is that because I inherited the site, I'm not even sure where to begin with sussing out the problematic bit of code.

I tried inserting the following into my custom css to force it to work, but it does not:

.gform_wrapper .gfield_checkbox li label, .gform_wrapper .gfield_radio li label {
display: inline-block;
}

I don't have any html code because the site is ultimately a wordpress site and there's a ton of CSS in the stylesheet D:

I believe this is all the related code:

https://pastebin.com/EYp5d41H

Solution

  • It is happening because of the break tag (<br> tag). Which is being added from the gravity form.

    Please remove the break tags and then add your css. It will be aligned properly.

    enter image description here