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 Karthika Muthusamy
Karthika Muthusamy
1,363 Points

give the paragraph a border 4px wide solid color red

how to set the border to <p> element

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

    <p class ="main-pg" <align>bordersize="4px" borderstyle="solid" ></align>My amazing website</p>

  </body>
</html>
styles.css 
.main-pg
{
  border:red;
}
Isaac Shoman
Isaac Shoman
4,638 Points

Hey Karthika,

I think what's happening is that some of your styling is inline and some is in the styles.css file. Inline styling overrides everything else. Try the following:

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

This way all your styling is in one place which makes it easier for others (and yourself) to read/debug. Hope this helps!

1 Answer

Claire Calder
Claire Calder
19,573 Points
Claire Calder
Claire Calder
19,573 Points

Hi Karthika,

This is the code you need to complete this challenge:

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

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

  </body>
</html>

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

Or the this is the shorthand css code:

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

Hope this helps!