<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Result</title>
</head>
<body>
<!--Add your HTML below!-->
<h3 class="fancy">This is an h3 header<h3>
<p class="fancy">This is a paragraph under the header</p>
<p id="serious">Here is yet another paragrph for testing</p>
<p> Oh, yet another paragraph. Fun.</p>
</body>
</html>
/*and the css*/
/*Add your CSS below!*/
.fancy {font-family:cursive;
color:violet;
}
#serious {font-family:Courier;
color:#8c8c8c;
}
body :nth-child(4) {font-size:26px;
}
If I’m not mistaken, you’re supposed to use
p:nth-child(4)
They’re telling you that when you use nth-child, you have to count all the children in the body, not just the ones that are the same as the element you’re trying to change.
@eternallocket, p:nth-child(4)
and body :nth-child(4)
are both correct. but p:nth-child(4)
will only get “executed” if you the 4th element is a paragraph, and body :nth-child(4)
will always select the 4th element inside body (the space between the css selector and the colon makes a huge difference)
@wyattonix, your h3 closing tag is missing a slash, messing up the count
1 Like
I got the exact same mistakes.
it’s good to know that body:nth-child(4) and body :nth-child(4) are actually different because of a space.