HTML&CSS - z-index

by Code_Garage

HTML

<div class="container" id="blue">z-1</div>
<div class="container" id="red">z-2</div>
<div class="container" id="yellow">z-3</div>

CSS

.container {
  font-family: arial;
  font-weight: bold;
  width: 50px;
  height: 50px;
  margin: 5px;
  padding: 5px;
  color: white;
  box-sizing: border-box;
}
#blue {
  background: #3498db;
	position: absolute;
	top: 5px;
	left: 5px;
  z-index: 1;
}

#red {
  background: #e74c3c;
	position: absolute;
	top: 25px;
	left: 25px;
  z-index: 2;
}

#yellow {
  background: #f1c40f;
	position: absolute;
	top: 50px;
	left: 50px;
  z-index: 3;
}