Design a Business Card - Design a Business Card

HTML-CSS
1

Tell us what’s happening:

My code isn’t passing “33. After the second hr element, there should be a div element with a class attribute with a value of social-media. ” I can not figure out why. Thank you for any advice/any help!

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
    <link href="styles.css" rel="stylesheet">
    <meta charset="utf-8">
    <title>Business Card</title>
</head>

<body>
 <div class="business-card"><img class="profile-image" src="https://cdn.freecodecamp.org/curriculum/labs/flower.jpg" alt="meaningful description"l></img>
 <p class="full-name">Full Name</p>
 <p class="designation">Full Stack Developer</p>
 <p class="company">Company name</p>
 <hr></hr>
 <p>Email Address:gmail@gmail.com</p>
 <p>Phone number:555-555-5555</p>
 <a class="portfolio-link" href="idk.com">Portfolio</a>
 <hr></hr>
 </div>
 <div class="social-media">
     <h2>Connect with me</h2>
     <a href="twitter.com">Twitter</a>
     <a href="linkedin.com">LinkedIn</a>
     <a href="github.co">GitHub</a>
 </div>
</body>

</html>

/* file: styles.css */
body{
  background:rosybrown;
font-family:Arial,sans-serif;
}
p{
  margin-top:5px;
  margin-bottom:5px;
  }
a{
  text-decoration: none;
}
.business-card{
  width:300px;
  background-color:rgb(202, 96, 96);
  padding:20px;
  margin-top:100px;
  text-align:center;
  font-size:16px;
  margin-right:auto;
  margin-left:auto;
}
.profile-image{
  max-width:100%;
}

Challenge Information:

Design a Business Card - Design a Business Card

2

Is your new div element directly following the hr element?

Also, it’s not causing your code to fail but the hr element is self-closing, so only needs one tag.

1 Like
5

Hi Buddy, Here also you need to see improve this that img tag is also self-closing tag it doesn’t require a closing tag.

Hope You Understand.