Just trying to fix that via z-index of the respective divs displaying the hamburger. But the modal is overlaying it no matter what the z-index is. The reason I want to accomplish that, is that in case of the animated Hamburger (from the design library) it transforms nicely to a close button on click, and I want to keep that close button visible above the modal (which I need to cover 100% of the screen), and I want to avoid to define a different close button in a different place within the modal for UX reasons.
Is that any way possible?
Applying a position to your element should do the trick, if z-index is set accordingly.
does not in my case, settings:
Experimenting with different position settings does not help either
Is the hamburger div inside a fixed parent?
position:fixed creates a new stacking context, thus it’s the fixed parent that will have to have a higher
z-index than the modal.
You might want to review the nesting of your hamburger element in this case.
seems not to be nested in a fixed positioned element, structure is as follows:
Can you share a link or your section block via file?
I’ll be happy to take a quick look.
would be a temporary login link be ok? Could send that via messages here
Checking things on front-end is sufficient, so a normal like would do
Thanks for your recommendation, but did not help, even setting the overall header section’s z-index to a value above that one of the modal, does still put the modal above. Must something inherent with a modal functionality in general to prevent what I intended to do
The z-index of your
<header> section needs to be 1002 at least.
Is this the case?