CSS Z index and stacking order

Intro

This is kind of an advanced property in CSS and all you need to think about here is layers (as in photoshop) and them z index will be a piece of cake for you. All it is do you want a layer or element (let's say Image) to be overlapped or on top.

There is a natural flow of html meaning that elements you code first get displayed first.

Positioning

Basically you need to know what is absolute, relative and static does. How you change your position of div to absolute is by
div{
position: absolute;}

And how you change z index is like this:( inside any class you want, here z index)
z-index:1;

Note: z index property t only works when you have a position of element set to absolute.

Resources

Here is a flowchart about z index from Dr Angela Yu which is going to help you if you get stuck somehere