Question

Hello guys im really new to JS and CSS, and im just testing skills in gamedevelopment…

[removed link]

if you try pressing “W” key several times you ll see that the blue div when he leaves zone of a parent div he goes under the neighbour div… how to solve this?

please help

Answer 1

First, the answer:
Remove the z-index of the parent boxes (the red ones)

now the inner workings:

The problem with setting a z-index to siblings and their children, is that each time you set a z-index to a parent, all of it’s children’s z-indexes will now be relative to the parent’s.

i.e. if one sibling’s child has a higher z-index than another sibling’s child, while both parents have their own z-index, those children will not be in the same hierarchy.

try removing the z-indexes of the red boxes, and only having the z-index on the children.

given that this is the result you seek.