How to reduce white space ie distance between header image and first block thereafter

How to reduce white space ie distance between header image and first block thereafter.

Hi,

You can try this CSS snippet:

.hp-form.hp-form--wide.hp-form--primary.hp-block.hp-form--listing-search {
    margin-bottom: 1rem; 
}

Hope this helps.

I am not using the listing search on the hero image so the above snippet dont help. How else to reduce white space below hero image

You can start with this one and then adjust it to your needs, you can also try an AI assistant for this request:

.site-content {
    padding: 1rem 0;
}

or

.site-content {
    padding-top: 10px;
}

For future reference, it’s always very helpful if you can include a screenshot or provide a few more specific details when describing an issue. This allows us to understand the situation more clearly and ensures that we can offer the most accurate and effective support possible.

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

How can I reduce the large space under hero image

Hi @horizonbookings.com,

You would typically adjust this on the Edit screen of the Page itself. (Visit the backend of WordPress > Pages > Home.

Nevertheless, you can also achieve this by using a snippet.

In the backend of WordPress visit Appearance > Customise > Additional CSS. Paste in the following:

/* reduce spacing under hero image on homepage */
.home .site-content {
    padding: 1rem 0;
}

I hope this helps!

Cheers,
Chris :victory_hand:

Hi,

Please note that I will merge this topic with your existing one: How to reduce white space ie distance between header image and first block thereafter.

Additionally, please add the license key from your previous purchase to have access to the topics that are related to premium products.