Gravity Forms "0" Margin

[co50]

I’m trying to figure out why the Pro theme (integrity stack) removes the vertical margin spacing between the card number and the fields below it in the below example. We have this exact same form on other sites with Pro and the spacing is proper. I could not find any errant CSS inserted to cause this and I’ve disabled every plugin to make sure that doesn’t affect it. I’m baffled. I know how to correct this with addtl CSS but what I’m wondering is why this happens and if it’s supposed to happen?

https://cupcakesbydebra.com/pay/

[paul.r]

Hi,

The credit card field is an addons and not a standard field so the theme’s css for gravity forms might not have included this.

I will forward it to our web development team for review.

For the mean time, you can try adding this in Theme Options > CSS

.gform_wrapper .ginput_complex .ginput_full {
       min-height: 0;
}

.ginput_container_creditcard input {
    margin-bottom: 12px !important;
}

Hope this helps

[co50]

I thought that was the cause, but it isn’t. We use this exact same page and form on other sites and the spacing is correct. For example: https://advancedbedbugs.com/invoice/

So that’s why I’m trying to figure out where the inconsistency is from. We literally cloned the page and form from one site to the next so it should be exactly the same page and should look the same.

[mldarshana]

Hi There @co50

Could you please try adding the following code instead and

.gform_wrapper #input_4_3_1 {
    margin-bottom: 12px;
}

It should render as follows.

Make sure to clear full cache before testing (https://www.wpbeginner.com/beginners-guide/how-to-clear-your-cache-in-wordpress/).

Hope that helps.

[co50]

Thanks. Just to reiterate, I know what CSS to make the spacing proper, I was just wondering why this spacing isn’t proper to begin with on this site when other sites using Pro and the exact same form/page have the correct spacing without needing any extra CSS.

[paul.r]

HI,

I checked https://advancedbedbugs.com/invoice/ . The spacing is correct, it’s because of this extra code that you have added in Theme Options > CSS

body input[type=text],
body textarea,
body input[type=email],
body select,
body input[type=password],
body input[type=tel],
body input[type=url],
body .gform_wrapper .gform_body ul.gform_fields li.gfield+li.gfield,
body .gform_wrapper .gform_body ul.gform_fields li.gfield {
    border-radius: 6px;
    border-width: 1px;
    margin: .65em 0!important
}

Try to remove it and the spacing will be the same as in https://cupcakesbydebra.com/pay/

Thanks