18. Show if you know it!


#1


https://www.codecademy.com/en/courses/web-beginner-en-WF0CF/3/5?curriculum_id=50579fb998b470000202dc8b#


I think the first link is supposed to be one color and the last a different color right? All my links are the same color. Codeacademy passes me to the next question, but I am wondering why the links are all the same color? Was there something I missed?


<!DOCTYPE html>
<html>
	<head>
		<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
		<title>Result</title>
	</head>
	<body>
		<!--Add your HTML below!-->
		<p><a href="http://tatoohunter.blogspot.com/2013/05/dragon-tattoos-brief-history-of-meaning.html">Dragon Tattoos</a></p>
		<p><a href="http://dragonland2000.blogspot.com">Dragon Armor</a></p>
	<p><a href="http://www.schoolofdragons.com/?lang=fr">School of Dragons</a></p>
	</body>
</html>

/*Add your CSS below!*/
a:hover {
    text-decoration: none;
}
a:first-child {
    color: #CDBE70;
}
a:nth-child (3) {
    color: #FFC125;
 }


#2

all links (<a></a>) are first child of paragraph, for this to works all links should be nested directly in the body

if you want this to work, use p to count with nth-child, and then select the link element inside the paragraph


#3

Okay, I used p to count with nth-child, and it is the still the same color as the first link. Why? Aren't all my links nested in the body?





Result



Dragon Tattoos
Dragon Armor

School of Dragons



/*Add your CSS below!*/
a:hover {
text-decoration: none;
}
a:first-child {
color: #CDBE70;
}
p:nth-child (3) {
color: #FFC125;
}


#4





Result



Dragon Tattoos
Dragon Armor

School of Dragons




#5

once you selected p:nth-child(3) and p-first-child, you need to select the link inside the paragraph:

p:first-child a {property: value}

links won't inherit from parent. so a needs be part of your css selector (this won't pass the exercise)


#6

That worked, thanks =)


#7