Problem new donation is displaying to high on the page

Hi @horizonkarateclub,

This is a result of your site’s CSS (styling) being a bit too opinionated.

We try our best to “stay in our lane” with Give’s CSS, and let the theme do the bulk of the work of styling. Every now and then, depending on the theme, it means we got a little too “out of the way.”

Here’s a short CSS snippet that will resolve your issue:

body #wrapper-container #main-content { margin-top: 200px; }

Adjust the value as needed.

If you need assistance implementing custom CSS on your WordPress website, we have this guide for you:
https://givewp.com/documentation/resources/handling-custom-css-in-wordpress/

Please note that this code snippet is provided as an example of how you can extend GiveWP with code. It’s up to you to implement and customize to your liking. We cannot provide support for custom code on your website, only the code that we create and distribute.

Hello,
Thanks for you answer. I read the documentations, and installed “my custom functions” plugin. Unfortunately, we don’t know which exact code to copy in our php code in the plugin.

Thanks to one example in the doxumentation, and your css code, We tried :
/**
* The Multi-Step form template loads in an iframe, which prevents theme styles from interfering with form styles.
* To style Multi-Step forms, use this PHP snippet to add inline styles. Replace lines 13-17 with your custom styles.
*
*/

function override_form_template_styles_with_inline_styles() {
wp_add_inline_style(
‘give-sequoia-template-css’,
‘
/* add styles here! A sample (turns the headline text blue): */
.body #wrapper-container #main-content { margin-top: 200px; }
‘
);
}

add_action(‘wp_print_styles’, ‘override_form_template_styles_with_inline_styles’, 10);

—-
We also tried with “body #wrapper-container #main-content { margin-top: 200px; }” without “.body” but only “body”. Still doesn’t work.

Do you have recommandations? We think we would really enjoyed give plugin but can’t use it without solving this.

An other think : normally, our website have a page template (cover photo on top, etc.) and that template is not displaying. So there is the margin top issue, but also the page template. Is the donation page a archive page or something ? It is like the page is displaying full screen, wheareas cover on top & sidebar usually on our website.

We contacted our theme support, but they says the issue should be fix directly with the plugin.

Thank you very much,
HKC