Home Forums Community Forum Menu on wrong layer: under text, images

Viewing 15 posts - 1 through 15 (of 18 total)
  • Author
    Posts
  • frautanja
    Participant
    Post count: 6

    I have designed a menu with the menu builder.
    But when it expands it opens unter the page elements. Meaning: images and text of the pages are shown on top of the menu items so that these are not visible.

    Any ideas how to fix that?

    GrueneRaider
    Participant
    Post count: 2

    I have the same problem using the header builder.

    GrueneRaider
    Participant
    Post count: 2

    You can see it at the link below. Hover over MY LOCKER in top right.

    https://hardwoodtexas.com/test-header

    marklchaves
    Participant
    Post count: 873

    Hello @grueneraider,

    You can try lowering the z-index for your top-level navbar. It’s set to 152 right now, and I don’t think it needs to be that high.

    
    .fusion-fullwidth.fusion-builder-row-2 {
        z-index: 1 !important; /* Lower this so that the submenu above displays over it. */
    }
    

    Thanks!

    marklchaves
    Participant
    Post count: 873

    Hi @grueneraider,

    Here’s a screengrab of the result that worked for me.

    https://imgur.com/a/mwn5kbC

    Thanks!

    frautanja
    Participant
    Post count: 6

    Thanks. I pasted your code in the custom css area but it makes no difference.

    https://imgur.com/RUkMcQo

    frautanja
    Participant
    Post count: 6

    I guess the menus (main, sub) have to get a higher z-index. But as I am not a coder I have no idea to do so.
    Can someone help me with that?

    Thank you very much.

    MarcSt
    Participant
    Post count: 1

    I have the same problem. Looking for help.

    marklchaves
    Participant
    Post count: 873

    Hello @grueneraider,

    I don’t see the custom CSS code in your page. Can you please make sure you’ve saved it and you’ve cleared/purged any server caches you have?

    https://imgur.com/a/5xwLHyp

    How to add custom CSS to WordPress.

    Thanks!

    AnitavanKempen
    Participant
    Post count: 1

    hi, i have a similar problem with the submenu specially in the mobile view. I build it with the Avada layout builder and already understand that i have to change the Z-index, but i don’t know where to address it.
    Another issue is, that i would like to reduce the padding or the line-height of the submenu. How can i adress that?

    everthing on https://www.wilfriedscooking.com/

    Thanks

    yasin1989
    Participant
    Post count: 2

    hi , try this
    use this code in Custom CSS

    #wrapper #main .fullwidth-box .fusion-row {
    z-index: 1 !important;
    }

    Grafdesign
    Participant
    Post count: 19

    You can raise the whole container. Give the container a class name like “raise”. Then go to the custom css in global options and type: .raise {z-index:20;}

    That should fix the issue.

    LBrand309
    Participant
    Post count: 2

    You can raise the whole container. Give the container a class name like “raise”. Then go to the custom css in global options and type: .raise {z-index:20;}

    Thanks @Grafdesign – your fix worked perfectly (and easily!) for me.

    SteveC
    Participant
    Post count: 2

    Yes! .raise {z-index:20;} worked perfectly. Many thanks!

    treyholland
    Participant
    Post count: 1

    Very helpful for mobile menu issues, worked perfectly.
    Thank you!

Viewing 15 posts - 1 through 15 (of 18 total)
  • You must be logged in to reply to this topic.