img{
z-index: -1;
position: absolute;
}
				
			

				
					
img{
z-index: -1;
position: absolute;
}
img{
z-index: -1;
position: absolute;
top: 0px;
margin-left: 40px;
}
				
			

Video Summary

All right, we’re going to cover the Z index. And basically the Z index allows you to stack elements on top of each other. So say for instance, we have this image right here and we want to stack a heading text over that. Originally if we would just have one line of code that says, heading h1 Heading section, and then we’d have an image below that the heading section would be above the image and the image would be below. But by using the Z index and the position absolute, we’re able to talk this image behind the heading section. Now, the reason why I had to talk about the Z index before I could get to the position absolute was that otherwise describing it wasn’t going to make much sense. And really what the absolute position is used for is when we’re trying to stack elements on top of each other. We want to say that this position is absolute it is constant. We want to have this image in this in this section, and then we want maybe this heading or this image on top of that, and we want this element on top of that. And we do this between going from negative one all the way to 1234 and five. And to really understand this we’re going to we’re going to have to go into code pen and set this up. But before we do, I do want to say that once we decide that we have a couple elements that we want to stack on top of each other. We are also going to have to use the either the side Pitt side placement properties or the margin properties to maneuver each individual element to where we want to otherwise they won’t stack on top of each other. So with that being said, I think we just hop over to code pen and this will make a lot more sense when we get in there.