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 alexarinze
alexarinze
5,937 Points

Select the class intro and set its font weight to bold.

Confused with this code cant seem to find my problem

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>
<div id="my-attribute"></div>
<p class="intro">
style.css 
body { background-color: lightblue; 
}
h1 {
    color: darkblue;
}
body {
  background-color: lightblue;
}

h1 {
  color: darkblue;
}

p em {
  color: red;
}
<div id="my-attribute"></div>
}
.intro {font-weight: bold; }
Dewane Mutunga
Dewane Mutunga
Courses Plus Student 3,771 Points
Dewane Mutunga
Dewane Mutunga
Courses Plus Student 3,771 Points

Remove the div and p elements after the html tag then remove the div and the hanging curly brace in your css file then add the following:

            .intro{font-weight: bold;}
Antonio Jaramillo
Antonio Jaramillo
15,604 Points

You have added an HTML <div> tag to your CSS file, which is the root of your problem.

1 Answer

Haider Ali
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Haider Ali
Python Development Techdegree Graduate 24,728 Points
Haider Ali
.a{fill-rule:evenodd;}techdegree seal-36
Haider Ali
Python Development Techdegree Graduate 24,728 Points

hi, this is what your code should look like.

<!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>

body {
  background-color: lightblue;
}

h1 {
  color: darkblue;
}

p > em {
  color: red;
}

.intro {
  font-weight: bold;
}