Design a Business Card - Design a Business Card

HTML-CSS
1

Tell us what’s happening:

STEP 32: Says to set class to social-media.
My code appears to be in format - Can anyone confirm why it is not working?

Your code so far

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

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

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

    <img class="profile-image" src="https://cdn.freecodecamp.org/curriculum/labs/flower.jpg" alt="pinkflower">
<p class="full-name">Mark Lewis</p>
<p class="designation">Amateur Coder</p>
<p class="company">RBC BANK</p>
<hr>
<p>mark.hayden.lewis@gmail.com</p>
<p>(555)555-5555</p>
<a href="doittoit.com">Portfolio</a>
<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.com">GitHub</a>
</div>
</body>
</html>


/* 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:white;
padding:20px;
margin-top:100px;
text-align:center;
font-size:16px;
margin-right:auto;
margin-left:auto;}

Your browser information:

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

Challenge Information:

Design a Business Card - Design a Business Card

2

Try rereading the step to make sure you’ve placed the div with the social-media class in the correct place.

1 Like
3

Thank You kaykay1424 - You are correct. I needed to nest the 2nd div inside of the first div
MUCH APPRECIATED!!!

1 Like