Z-Index with for Global Block Modal

I’m having an issue with my mobile device menu (which is setup as one Navigation-Off Canvas inside another Navigation-Off Canvas element).

I have a Global Block button that triggers a Modal, but the modal shows behind the mobile menu.

This does not occur on the desktop version (which is setup as Navigation Drop-Down elements).

Hi @npn,

Thanks for reaching out!

Would you mind sharing the site URL so that we can check the settings? I would also like to ask for the admin credential. To do that, please give us the following information in a Secure Note.

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts.

Thank you.

Sent. Thanks!

Hi @npn,

Thank you for the credentials but you have a lot of headers on the site, can you provide the name of the header involve? It’s hard to inspect it from the front end.

Thanks,

Sure thing.

This is with GLOBAL (New - MAIN)

Hello @npn,

You will have to edit your global block and make sure that your modal element has the highest z-index so that it will display on top of any other elements. Since there is no option to set the z-index of the modal element, you will have to find the "Customize’ tab and insert an inline element CSS instead.

For example:

$el {
  z-index: 9999;
}

The code above is just an example. You will have to change the correct value to make it work.

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third-party developer.

Best Regards.

Excellent. Thank you for the help on this.

Hi @npn,

You’re welcome and it’s our pleasure to help you! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

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