Design a Business Card

Programming HTML-CSS
1

I keep getting the error message: 17. After the a element containing your portfolio, there should be another hr element as a divider. I have it there and I have tried my code in both Edge and Chrome.

Here is my code:

<link rel="stylesheet" href="styles.css" />

<meta charset="utf-8">

<title>Business Card</title>

<div class="business-card">

    <img class="profile-image" src="https://cdn.freecodecamp.org/curriculum/labs/flower.jpg" alt="A vibrant flower in full bloom">

    <p class="full-name">Ann Magee</p>

    <p class="designation">IT Support Technician</p>

    <p class="company">Anngelic Web Design</p>

    <hr>

    <p>Email: me@gmail.com</p>

    <p>Phone: 555-555-5555<p>

    <a class="portfolio-link" href="portfolio-link">Portfolio</a>

    <hr>   

<div class="social-media">

    <h2>Connect with me</h2>

    <a href="https://www.twitter.com">Twitter</a>

    <a href="https://www.linkedin.com">LinkedIn</a>

    <a href="https://www.github.com">GitHub</a>        

</div>

/* file: styles.css */

body {

    background-color:  rosybrown;

    font-family: Arial, sans-serif;

    }

p {

margin-top: 5px;margin-bottom: 5px;

}

a {

text-decoration: none;

}

a:hover {

text-decoration: underline;

}

.business-card {

width: 300px;

background-color: beige;

padding: 20px; 

margin-top: 100px;

text-align: center;

font-size: 16px;

margin-left: auto;

margin-right: auto;

 }

img {

max-width: 100%;

 }
2

If you have a question about a specific challenge as it relates to your written code for that challenge and need some help, click the Help button located on the challenge.

image
image668×186 6.59 KB

The Help button will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.