Design a Business Card - Design a Business Card

HTML-CSS
1

Tell us what’s happening:

  1. After the phone number p element, there should be an a element with the text Portfolio

I have checked for errors tried different browsers and refreshed but nothing works.

Your code so far

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

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

<body>
    <div class="business-card">
    <main>

        <img class="profile-image" src="https://cdn.freecodecamp.org/curriculum/labs/flower.jpg" alt="flower">
        <p class="full-name">Your Name</p>
        <p class="designation">Software Developer</p>
        <p class="company">@FreeCodeCamp</p>

        <hr>

        <p>Email: hhhhhh123@gmail.com</p>
        <p>Phone Number: (123) 456-7890</p>
        <a href="https://chatgpt.com/c/6880ee8c-f640-8006-940e-bbed993d41ba">Portfolio</a>
       
        <hr>

        <div class="social-media">

            <h2>Connect with me</h2>
            <a href="https://shadeshiftglasses.myshopify.com/">Twitter</a>
            <a href="https://shadeshiftglasses.myshopify.com/">LinkedIn</a>
            <a href="https://shadeshiftglasses.myshopify.com/">GitHub</a>
        
        </div class="social-media">
        
        </main>

        </div class="business-card">

</body>

</html>

/* file: styles.css */
 body {
  background-color: rosybrown;
  font-family: Arial, sans-serif;
}

p {
  margin-top: 5px;
  margin-bottom: 5px;
}

.business-card {
  background-color: white;
  width: 300px;
  padding: 20px;
  margin-top: 100px;
  font-size: 16px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.profile-image {
  max-width: 100%;
}

a {
  text-decoration: none;
}

.social-media a {
  margin: 10px;
}

.full-name {
  font-size: 25px;
  color: grey;
}

.designation, .company {
  font-size: 18px;
  color: pink;

}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36 Edg/138.0.0.0

Challenge Information:

Design a Business Card - Design a Business Card

2

something is off here. Are those div tags meant to be closing tags?
if yes, they should not have any attributes inside.

3

Here in order to close your div tag you no need to add any class inside your div tag.

And one more thing you need to add the main tag after your all html code.

So here you need to use simple close div tag

1 Like
4

I am facing the exact same issue with 29 point. It accepts the href in ‘a’ element, it says you have a valid href in it too. for the Text ‘portfolio’, it does not read it. i have no idea why. for reference this is the code I am writing:

abcdef12345@gmail.com

090078601

Portfolio
5

Welcome to the forum @buttusama356

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. This button only appears if you have tried to submit an answer at least three times.

image
image622×306 7.96 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.

Happy coding