Am I using z-index wrong?

Coding Help
1 
#one {
	background-color: gray;
    width: 100%;
    height: 100%;
    z-index: -10;
}


#two{
	background-color: powderblue;
    width: 100%;
    height: 100%;
    z-index: 10;
}

Based on this CSS (referring two divs, one with the id “one” and the other with the id “two”). I want the powderblue one to be on top, but the gray one stays on top. What am I missing with z-index?

2

I fixed it! I had to set position to relative.

2 Likes
3

z-index probably didn’t help you in that case. Setting the position can just make it go forwards.

All you have to do to use z-index:

z-index:x;

That’s it. Also, if #one is position:fixed and is on top, #two would never be right on top like that, so you’d have to use z-index and put the #one elem below your #two elem.