project overlay to cover menu

[arminunruh]

.lay-project-overlay{
z-index: 20!important;
}

Enter this css in "lay options" -> "custom css & html" -> "custom css for desktop"

try this!

NOTE:
this is the correct css not the one above

#lay-project-overlay{
z-index: 20!important;
}

[rospax]

Hi @arminunruh, I'm trying to achieve this as well.
The above doesn't seem to work, no matter what i put for the z-index of the .laynav elements and the .lay-project-overlay elements, the nav is always visible above the overlay...

What could i be missing?

[arminunruh]

#lay-project-overlay{
z-index: 20!important;
}

i made a mistake, this should be the correct css!

[craigfeldspar]

Hi @arminunruh, thanks, it works on desktop but not on mobile, could you please help me?

[arminunruh]

Okay. Well, then, if you want it for mobile, you have to not just enter it in custom CSS for desktop but also in custom CSS for mobile.

.close-projects-overlay{
z-index: 90!important;
}
#lay-project-overlay{
z-index: 89!important;
}

[craigfeldspar]

Thanks — of course I had already tried that, as well as testing it in custom code before posting. However, since the preview in 'Customize' didn’t reflect that code, I thought it wasn’t working. But after testing it across several browsers, it turns out it does!

[arminunruh]

Oh don't worry about it. For mobile, it was a little different. We had to use a higher z-index and also use a z-index on the close icon, so it's understandable that it seems like it doesn't work at first.

[MaxHoff]

Hi, I have this project page with an overlay: https://www.softlaunch.live/puma-copy-3/

I added the css code below, so the overlay covers the site title and menu. When I reload the project page, the close button is not visible anymore and the site title + the navigation is visible again.

How can I maintain the cover of the overlay?

: #lay-project-overlay{
z-index: 20!important;
}

[arminunruh]

hey you cant, reloading a project will just show it without it being an overlay.
:/

[arminunruh]

mmh somehow on your page the first image does not load.
https://www.softlaunch.live/puma-copy-3/

can you go to lay options -> and disable this:

lazyloading