Archived topic
Padding issue of Contact Form 7 using GPP
3 replies · Started by yitegele on November 10, 2022
Hi GP support team!
How are you? I have a issue when using GPP and Contact Form 7.
Please have a look at the below address. You will find a space (around 40px) below the "Submit" button.
It seems that there is a hidden padding there, because if I use a different element instead of CF7, the bottom is perfectly aligned without any space, and I really didn't find a solution with Google.
Please help remove this space and make the bottom perfectly aligned. Thank you.
Best,
Yi
Hi there,
so the contact form does have some bottom margins, but it also has some hidden elements ( such as the loading the spinner or the error / success notice containers ) which take up space.
Try this CSS:
.wpcf7-form p:last-of-type {
margin-bottom: 0;
display: flex;
flex-direction: column;
}
.wpcf7-spinner {
order: -1;
}It will remove the bottom margin and move the loading spinner above the button.
Hi David!
Thank you so much for your help. Perfectly solved. I should've asked GP Support earlier. Thumb up!
Best,
Yi
Happy to be of help!
