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 Adding a Style to several Elements using Class

Posted by kelvino
kelvino
Courses Plus Student 10,694 Points

hello guys please i need help with my class padding 15px margin of 10px

index.html 
<!doctype html>
<html>
  <head>
    <title>List Example</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1>social-links</h1>

    <p>
    <a class="social-links">html links</a>
    <a href="https://www.Twitter.com" class="social-links">social-links</a>
    </p>
     <h2>social-links</h2>
    <p>
    <a class="social-links">This is my email</a>
    <a href="#"class="social-links social-links"> social-links</a>
</p>
  </body>
</html>
styles.css 
<!DOCTYPE html>
<html>
<head>
<style>
h1.social-links {
 padding-social-links: 15px;
  margin-social-links: 10px;
}
h2.social-links {
  padding-social-links: 15px;
  margin-social-links: 10px;
}
</style>
</head>
<body>


</body>
</html>

6 Answers

KRIS NIKOLAISEN
KRIS NIKOLAISEN
54,970 Points
KRIS NIKOLAISEN
KRIS NIKOLAISEN
54,970 Points

You have gone overboard with adding social-links :). I highly suggest you start over and do just what is asked.

For the first task you are to add a class called "social-links" to each anchor tag.

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

    <a href="#" class="social-links">Follow me on Twitter!</a>
    <a href="#" class="social-links">Send me an Email!</a>

  </body>
</html>

For the second task create a rule for the .social-links class

.social-links {
}

Then for the third task add two property value pairs between the brackets created in task 2.

One is padding: 15px. The other is margin: 10px.

kelvino
PLUS
kelvino
Courses Plus Student 10,694 Points
kelvino
kelvino
Courses Plus Student 10,694 Points

Thanks for sharing your thoughts I have gone passed that session

kelvino
PLUS
kelvino
Courses Plus Student 10,694 Points
kelvino
kelvino
Courses Plus Student 10,694 Points

I couldn't get it still, please I need more help: here are the error messages....!You need to set the 'class' attribute of the first <a> element to "social-links"

kelvino
PLUS
kelvino
Courses Plus Student 10,694 Points
kelvino
kelvino
Courses Plus Student 10,694 Points

Thanks, I got it right

Alexander Cross
Alexander Cross
1,667 Points
Alexander Cross
Alexander Cross
1,667 Points

I'm getting an error for padding 15px

my CSS is;

class.social-links { padding: 15px; margin: 10px; }

What am I missing???

kelvino
PLUS
kelvino
Courses Plus Student 10,694 Points
kelvino
kelvino
Courses Plus Student 10,694 Points

.social-links { padding: 15px; margin: 10px; }