Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Resolved] How to set the z-index of the navigation as high as possible?

Home Forums Support How to set the z-index of the navigation as high as possible?

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #373813
    Manuela

    Hi great peoples,

    I’m just a designer and not a coder. I think I know what I need to solve my problem, but I do not know how to target and write the code.

    Let me try to describe my problem. I’m working with GPP and Elementor Pro. I want to use a transparant navigation from GPP and a background via Elementor Pro, I will use that background full screen.
    It took me a while to figure it out, but the section with the image is on top of the navigation instead of under… So I think I have to target the navigation and set the z-index as high as possible… or am I just not thinking straight.

    So… can you help me out here?

    Link to my testpage… https://playground.vermeeren.nl/home/
    blue is the primary nav
    yellow the secondary nav
    and the image is in the background of a Elementor section

    As you see I set a negative margin and the image goes over the navigation. Unfortunately I can’t set a negative z-index 🙂

    Thank you!

    Manuela

    GP Premium 1.4.3
    #373865
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Give this a shot:

    #secondary-navigation {
        position: relative;
        z-index: 99;
    }
    #374118
    Manuela

    That really helped a lot.
    I also needed the primary above so I tried #primary-navigation aswell… well that did not work. But as soon I changed ‘secondary’ in ‘site’, it all fell together. Thank you.

    #site-navigation {
    position: relative;
    z-index: 99;
    }

    #374237
    Tom
    Lead Developer
    Lead Developer
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.