Design a Business Card - Design a Business Card in

HTML-CSS
1

Tell us what’s happening:

// running tests
31. After the a element containing your portfolio, there should be another hr element as a divider.
// tests completed

Your code so far

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

<head>
    <meta charset="utf-8">
    <meta name="Viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Business Card</title>
    <link href="styles.css"
    rel="stylesheet"/>
</head>

<body>

<div class="business-card">
    <main>
    <img class="profile-image" src="https://cdn.freecodecamp.org/curriculum/labs/flower.jpg" alt="Flowrshop that satisfied you and your smell"/>
    
    <p class="full-name"> Rimuru Tempest </p>
    <p class="designation"> Proprietor </p>
    <p class="company"> Drin's Flower Shop </p>
    <hr>
    <p>e-mail: drinsflower@gmail.com </p>
    <p>Phone: +639123456789</p>
    <p> <a href="www.facebook.com" target="_blank">Portfolio</a></p>
<hr>
    <div class="social-media">
        <h2>Connect with me</h2>
        <p> <a href="www.twitter.com" target="_blank">Twitter</a> </p>
        <p> <a href="www.linkedin.com" target="_blank">LinkedIn</a> </p>
        <p> <a href="www.github.com" target="_blank">GitHub</a> </p>
</div>
</main>
</div>
</body>

</html>

/* file: styles.css */
body{
  background-color: rosybrown;
  font-family: Arial, sans-serif;
}
p{
  margin-top: 5px;
  margin-bottom: 5px;
}
.business-card{
  width: 300px;
  background-color: lightblue;
  padding: 20px;
  margin-top: 100px;
  text-align: center;
  font-size: 16px;
  margin-right: auto;
  margin-left: auto;
}
.profile-image{
width: 300px;
height: 150px;

}
a{
  text-decoration: none;
  color: gray;
}
a:hover{
  text-decoration: underline;
}
hr{
  height: 3px;
  background-color: white;
  border-color: lightgreen;
}

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Mobile Safari/537.36

Challenge Information:

Design a Business Card - Design a Business Card

2

Welcome to the forum @Drin_o

Try removing the paragraph element nesting the anchor element.

Happy coding