Z-index Find the element stacking context
How do I find the stacking context of an element? Or, how do I find the parent element of the element that controls the z-index
child?
I have a very complex page with nested tables, div. And the hidden camera high z-index
is hidden.
I've fixed these issues before by methodically working my way through the ancestors of the elements until I figured out where to add the z-index
position value and value to create a new stacking context.
But I can't seem to fix this issue for this issue.
Is there a tool (either in browser developer tools or Javascript) where I can give it an element A
and it returns something like:
"element A is part of the stacking context, starting at element B, which is part of the stacking context, starting at element C, which is part of the context of the page root
Help me guys, you are my only hope.
source to share
McNulty, the tool you are looking for is a Chrome extension called "z-context" from the Github user gwwar. I am working on a very complex grid component that has many nested divs in the DOM structure and I need something to help.
I have used an extension and can confirm that it works from the date it was posted. Remember to open a new browser session after installing it.
source to share