How to stop the background image for the first section from sitting behind the header

Hi, 

The background image for the first section of my home page is sitting behind the header making it appear cut off. I'm wondering if there is a way to fix this so it sits just in its section. 

Thanks, Nikki 

Hi,

You can add a blank section above it > Then choose minimum height

@tuanphan Thanks for the reply. 

That works, but now my header is double the size! Do you know any other ways around it? 

Thanks. 

Always struggled with this too, but I think I found the solution.  Following the suggestion from @tuanphan above, I added a blank section above it, told it minimum height , and reduced the the minimum number of blocks to 1.  That got it pretty small but still added to the height of my header.

So I found the ID of the section (There's a nifty browser plugin I found somewhere that lets you easily identify section IDs,

Then in the custom CSS area I gave it a height: 0  code.

So:

section[data-section-id="FIND ID NUMBER"] {
  height: 0;
}

So far seems to work like a charm.

On 6/10/2023 at 11:37 AM, johnhalldesign said:

section[data-section-id="FIND ID NUMBER"] {
  height: 0;
}

So far seems to work like a charm.

I tried this to no avail. Site URL: https://addisonpann.com/greenslate

Any idea why?

8 hours ago, addisonpann said:

I tried this to no avail. Site URL: https://addisonpann.com/greenslate

Any idea why?

You need to unset default height with min-height

section[data-section-id="656a24b505e3c8250155f597"] {
    height: 0 !important;
    min-height: unset !important;
    padding-top: 0 !important;
}

By default, first section has a default padding, so padding-top will remove this