Why not use ".phone a " instead of "contact-info li.phone a" as selector in css ?

Hey there Smith and Ramon,

It could work here, but it could also cause problems if this logic was used in a different project. Ramon is correct is looking at the specificity of the selector. The way Nick does it, we know that it has to be a list inside .contact-info and that list item has the class of .phone and then its anchor tag.

Now, with just .phone a, we are just going to target an anchor inside of a class of .phone. All's good until you have your phone number somewhere else (on another page) that has the same class. Now both (even though you only wanted the one) would be styled with that rule. I would use the class .phone, anywhere I had a phone number. In my CSS, I would have a rule for just .phone, with specific styles.

So, you see, with just .phone a, I am not able to style just the one specific anchor without affecting all the other places I may have an anchor inside of a class with that name.

Specificity is a great tool, and while sometimes it seems like a lot of extra typing, it helps with readability, but most importantly, you won't style something you didn't mean to.

Keep Coding! :)