Z-Index Component

Hello! I have a Global Off Canvas Component that has a Global FAQS Mega Menu inside of it. On the homepage you are able to click on the Global Off Canvas and then click on the FAQS and it opens correctly, with the toggle opening on top. But on my other pages it is opening behind. Can you take a quick look and see if you can tell what is off? I am putting links in the secure.

Hello @Noellemena,

Thanks for writing in! It would be best to place the FAQs Off Canvas element after the Off Canvas Mega Menu. If that does not work, you can insert an inline element CSS to the FAQs Off Canvas to make sure that it stays on top:

$el.x-off-canvas {
  z-index: 10000;
}

Kindly let us know how it goes.

@ruenel, thank you so much! Unfortunately, this did not work. I just do not know why it all works on the home page fine and not on this simpler version of the same header. I am going to add login info and if you can see. Thank you no matter! Noelle

Hello @Noellemena,

The same CSS code should be applied to the Global Off Canvas with a lower z-index.

Please check the page now.

@ruenel you are my Knight :person_fencing: here always! Thank you so much. It is working perfect now. :slightly_smiling_face:

You are most welcome, @Noellemena.

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