CSS Specificity Demo

by Town

HTML

<div class="red blue">

</div>
<div class="blue red">

</div>

CSS

div {
  height: 100px;
  width: 100px;
  margin: 5px;
}

/*
Add a div element to the selector below to increase its specificity from 0010 to 0011 and turn the squares red 
*/
.red {
  background-color: red;
}

.blue {
  background-color: blue;
}