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

HTML Introduction to HTML and CSS (2016) Make It Beautiful With CSS Test: Styling by Element and Class

Posted by Solomon Miller
Solomon Miller
154 Points

Give the paragraph a border that is 4px wide, solid and red. I'm confused

what should i do

index.html 
<!doctype html>
<html>
  <head>
    <link href="styles.css" rel="stylesheet">
  </head>
  <body>

    <p  class="main-pg">My amazing website</p>

  </body>
</html>
styles.css 
a  class=.main-pg{ 
  border: 4px solid red;
}
Amitai Zand
Amitai Zand
12,513 Points
Amitai Zand
Amitai Zand
12,513 Points

Hi Solomon,

HTML and CSS have different syntax for classes. You have defined your class correctly in your HTML with the class="main-pg" attribute. However, in CSS, you need to use the notation of a dot followed by the class name (in other words, just .main-pg, no class=) before your curly braces in order for the CSS to work correctly. You should also remove the a selector, because your .main-pg class is assigned to a paragraph (<p>), not a link (<a>) in your HTML.

Your border: 4px solid red; delcaration within your CSS rule is formatted correctly.

2 Answers

Gonzalo Blasco
Gonzalo Blasco
10,405 Points
Gonzalo Blasco
Gonzalo Blasco
10,405 Points

I was about to say the same as Amitai Zand ... You are writing the wrong selector...

.main-pg {
    border: 4px solid red;
}