Position relative is required for z-index to work

You want to stack stuff in 3rd dimension; you require z-index. but wit h that you also require position:relative

by jshacker

HTML

<div class="first">1</div>
<div class="second">2</div>
<div class="last">3</div>

CSS

div {
  height: 100px;
  width: 100px;
  border: 2px solid black;
}
.first {
  background-color: #f77;
  z-index: 3;
  position: relative;
}
.second {
  z-index: 2;
  background-color: #7f7;
  position: relative;
  top: -20px;
  left: 40px;
}
.last {
  z-index: 1;
  background-color: #77f;
  position: relative;
  left: 20px;
}