Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Foundations Selectors Type, Class, and ID Selectors

Posted by Yan Cruz
Yan Cruz
20,439 Points

Select the em inside the paragraph using a descendant selector. Set its color to red?

I put the code p em { color: red; } , but it says bummer.

What is the code?

4 Answers

Ben Farr
Ben Farr
14,855 Points

This is the code I used just now and passed:

for the index.html:

<!DOCTYPE html>
<html>
<head>
    <title>CSS Selectors</title>
    <link rel="stylesheet" href="cc1-main-styles.css" type="text/css" media="screen">
    <link rel="stylesheet" href="style.css" type="text/css" media="screen">
</head>
<body>
    <h1><em>Hello</em> World!</h1>
    <div id="main">
        <p class="intro">
            <em>Lorem ipsum dolor</em> sit amet, consectetur adipiscing elit. Nunc pulvinar consequat tortor, nec venenatis erat elementum scelerisque. Curabitur sit amet risus nisi. Aenean aliquet euismod augue at viverra. Ut varius arcu in lorem iaculis ullamcorper. Integer eu rutrum quam.
        </p>
    </div>
</body>
</html>

For the style.css:

body {
  background-color: lightblue;
}

h1 {
  color: darkblue;
}

p em {
  color: red;
}
Yan Cruz
Yan Cruz
20,439 Points

Finally!

Haha. Thanks

Ben Farr
Ben Farr
14,855 Points
Ben Farr
Ben Farr
14,855 Points

It looks like you just missed one little thing, try:

p > em { color: red; }

Hope this helps.

Yan Cruz
Yan Cruz
20,439 Points

Nope.

Still says bummer.

Should I put it before of after?

Since I tried inside the em, but it send me back to the first one.

Yan Cruz
Yan Cruz
20,439 Points

Nope.

Still says bummer.

Should I put it before of after?

Since I tried inside the em, but it send me back to the first one.

Ben Farr
Ben Farr
14,855 Points
Ben Farr
Ben Farr
14,855 Points

hmm, that should work. I took the test myself to test and it worked for me. can you copy and paste all of your code to look? Thanks!

Yan Cruz
Yan Cruz
20,439 Points

<!DOCTYPE html> <html> <head> <title>CSS Selectors</title> <link rel="stylesheet" href="cc1-main-styles.css" type="text/css" media="screen"> <link rel="stylesheet" href="style.css" type="text/css" media="screen"> </head> <body> <body style="background: lightblue;"> <style> h1 { color: darkblue;
} </style>

<h1><em>Hello</em> World!</h1>
<div>
    <p>
  p > em {

color: red; } <em>Lorem ipsum dolor</em> sit amet, consectetur adipiscing elit. Nunc pulvinar consequat tortor, nec venenatis erat elementum scelerisque. Curabitur sit amet risus nisi. Aenean aliquet euismod augue at viverra. Ut varius arcu in lorem iaculis ullamcorper. Integer eu rutrum quam. </p> </div> </body> </html>

Cosmin Cioaclă
Cosmin Cioaclă
21,339 Points
Cosmin Cioaclă
Cosmin Cioaclă
21,339 Points

To be fair, Yan's code uses a descendant selector while Ben's code uses a child selector.