The nth-child class allows us to pick any occurrence of an element within its parent. Let's get into the CSS and change last-child to nth-child(2):
.primary-nav > li:nth-child(2) > a { background-color: deeppink; color: #fff;}
Save the code and refresh the site:
So, on our site, the pink color should actually be applied to h2 and HOME because the h2 is the first element inside the ul and HOME is the second.
If you are a JavaScript person, nth-child is not zero indexed, so the first one is not zero: The first one is one.
With this in mind, let's set nth-child to 1: which is essentially the same as using first-child:
