Design a Business Card - Design a Business Card

HTML-CSS
1

Tell us what’s happening:

My no. 7 is incorrect, but I see no underline appear on links..

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://imgs.search.brave.com/GaKScGCRI4etLgeofB5OpFS9KB3W0UVBlYI010Xvzyk/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9tZWRp/YS5nZXR0eWltYWdl/cy5jb20vaWQvMTY1/NzkwMzMzL3ZlY3Rv/ci9lYWdsZS1zeW1i/b2wuanBnP3M9NjEy/eDYxMiZ3PTAmaz0y/MCZjPTBwVElqSG1X/SmhWM1NRNlNGMlAt/Sjc0a3VrVGt5Z3dU/dXJ0emhnMXllLWs9" alt="condor-logo">
        <p class="full-name">MEIL JERI N FRIAS</p>
        <p class="designation">Data Analyst</p>
        <p class="company">C0NDOR</p>
        <hr>
        <p>email address: ex@gmail.com</p>
        <p>phone number: 07063875096735</p>
        <a class="portfolio-link" href="https://www.sandrafigueras.com/">Portfolio</a>
        <hr>
        <div class="social-media">
        <h2>Connect with me</h2>
        <a href="https://x.com/pewpiece">Twitter</a>
        <a href="https://x.com/pewpiece">LinkedIn</a>
        <a href="https://x.com/pewpiece">GitHub</a> 
        </div>

      
    </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:rgb(254, 248, 248);
    padding:20px 20px 20px 20px;
    margin-top:100px;
    text-align:center;
    font-size:16px;
    margin-left:auto;
    margin-right:auto;
}
.full-name{ margin: auto;

}

.designation{ margin: auto;
    
}

.C0NDOR{ margin: auto;
    
}

.portfolio-link{
        text-decoration:none;
        color: grey;
 }

 a:hover{
     color:rgb(162, 162, 255);
 }
.profile-image {
    max-width: 100%;
}

.social-media, a {
        margin:10px;
        text-decoration:none;


}

Your browser information:

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

Challenge Information:

Design a Business Card - Design a Business Card

2

the css code you add removes them. See, without css:

image
image198×150 3.07 KB

with css:
image

the issue is that the tests expect a selector that targets all possible existing links

1 Like
3

Thank you for answering. I did it, I need to just hover the anchor tag with declaration, text-decoration: underline;