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 trialSolomon Miller
154 PointsGive the paragraph a border that is 4px wide, solid and red. I'm confused
what should i do
<!doctype html>
<html>
<head>
<link href="styles.css" rel="stylesheet">
</head>
<body>
<p class="main-pg">My amazing website</p>
</body>
</html>
a class=.main-pg{
border: 4px solid red;
}
2 Answers
Gonzalo Blasco
10,405 PointsI was about to say the same as Amitai Zand ... You are writing the wrong selector...
.main-pg {
border: 4px solid red;
}
Gavin Eyquem
Front End Web Development Techdegree Student 20,443 PointsAlways remember if you use an ID (#) or a class (.)
main-pg {
} .main-pg { }
Amitai Zand
12,513 PointsAmitai Zand
12,513 PointsHi 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
, noclass=
) before your curly braces in order for the CSS to work correctly. You should also remove thea
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.