so i’ve got this, roughly:
<div id='A'> <ul> <li id='B'>foo</li> </ul> </div> <div id='C'> ... </div>
These are positioned so that B and C overlap.
A has a z-index of 90, B has a z-index of 92, and C has a z-index of 91. But C shows up in front of B. What am i doing wrong? (Let me know if more detail is necessary.)
Using
z-indexis only relevant for elements in the same container. Since B is contained inside A, B’s z-index will only apply when resolving other elements inside A. As far as C is concerned, both B and A are rendered at z-index 90. However if C is placed inside A, then B will render in front.