Gravity Forms: checkbox alignment issue

Hello,

We are having issues with the vertical alignment of the checkboxes in the GF forms. The form looks okay in the plugin preview window, but on the actual page it doesn’t mirror, so we figured the issue could be with Pro.

We’d like the checkboxes to be align on top, so they are all next to the first line of text (and not in the middle of the paragraph).

Here’s a screenshot of what we want:

This is how it currently looks on the page:

We tried adding this piece of code to Custom CSS:
.gform_wrapper ul.gfield_checkbox li input[type=“checkbox”] {
margin-right: 5px;
vertical-align: top;
}

It worked for the margins but the vertical-align item doesn’t change.

Thank you!

Hi There,

Would you mind providing us with the URL of the page contains GF forms? I checked your license page but couldn’t find the correct one.

Thank you.

Here’s the URL with the GF form: https://getboober.com/gethelp/

Hi There,

Thanks for writing in!

I can see the checkboxes are aligned properly with text.

Please confirm if you have the issue with any specific browser or OS.

Remember, this is something related to a third party plugins and CSS, which is out of theme. support scope we will try our best to point you for a fix.

Thanks

Hi there,

Yes those look good but scroll down, the last Terms and Conditions checkboxes are aligned middle (at least for us). Screenshot below.

THANKS!

Hi again,

To fix the issue, please try adding the following code in the Theme Options > CSS:

body .gform_wrapper ul.top_label li ul.gfield_checkbox li {
    display: block !important;
}

Don’t forget to clear all caches after adding the code. Let us know how this goes!

Thank you so much! That did the trick!

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.