Design a Business Card

HTML-CSS
1

Been trying to figure out how to pass
27. “Your link element should be within your head element.”

No matter where within the head element I place it in, it keeps cropping up this issue – send help please?

index.html

<!DOCTYPE html>
<html lang="en">
<div class="business-card">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="styles.css">
    <title>Business Card</title>
</head>

<body>
<img src="https://cdn.freecodecamp.org/curriculum/labs/flower.jpg" alt="a pink flower" class="profile-image"/>
<p class="full-name">Mage Coinless
    </p>
    <p class="designation">Keter Class
        </p>
        <p class="company">SCP Foundation
            </p>
            <hr>
            <p>
            mgc@scp.com
                </p>
                <p>
                    774-302-6688
                    </p>
            <a class="portfolio-link" href="https://bsky.app/profile/alchemistdreamer.lgbt.blue">Portfolio</a>
            <hr>
            <div class="social-media">
                <h2>Connect with me</h2>
                <a href="https://x.com/ObeyMeOfficial1">Twitter</a>
                <a href="https://www.linkedin.com/">LinkedIn</a>
                <a href="https://github.com/MeepingMeepers">GitHub</a>
                </div>
</body>
</div>
</html>

styles.css

body{
  background-color: rosybrown;
  font-family: Arial, sans-serif;
}
.business-card{
  width: 300px;
  background-color: lavender;
  padding: 20px;
  margin-top: 100px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
  font-size: 16px;
}
.profile-image{
  max-width: 100%;
}
p{
  margin-top: 5px;
  margin-bottom: 5px;
}
a{
  display: inline;
  text-decoration: none;
}
2

Welcome to the forum @MeepingMeepers

Why is there a div element above the head element?

The structure is:

-html
-head: meta, link, title
-body: content elements

Happy coding

1 Like
3

Ok, so I switched the place of the div element and put it in the body one instead and now it said it works. Thank the you for this.

1 Like