Tell us what’s happening:
how can i uncover the code writen on the background-color of my page using cssDescribe your issue in detail here.
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="styles.css" rel="stylesheet" />
<title>Personal Portfolio Webpage</title>
<nav id="navbar">
<div class="container">
<div class="nav-content">
<ul>
<li><a href="#welcome-section">about</a></li>
<li><a href="#projects">projects</a></li>
<li><a href="#contact">contact</a></li>
</ul>
</div>
</div>
</nav>
<body>
<section id="welcome-section">
<h1>Hey i am a web developer</h1>
</section>
<section id="projects">
<div >
<h2 class="project-tile">These are some of my projects</h2>
<a href="https://codepen.io/freeCodeCamp/full/zNqgVx" target="_blank"></a>
</div>
</section>
<secton id="contact">
<div class="c-container">
<h2 class="title">let us work together</h2>
<p>You can reach me through following platforms</p>
<li><a id="profile-link" target="_blank" href=""><i class="fab fa-facebook"></i>Facebook</li>
<li><a target="_blank" href=""><i class="fab fa-instagram"></i>Instagram</li>
</div>
</section>
</body>
/* file: styles.css */
#navbar{
width: 100%;
background-color: #be3144;
position: fixed;
top: 0;
left: 0;
right: 0;
border-
z-index: 5;
}
.nav-content ul{
font-size: 18px;
font-weight: bold;
list-style: none;
width: 85%;
display: flex;
justify-content: flex;
}
.nav-content ul li{
display: inline-block;
margin-right: 18px;
}
.nav-content ul li: last-child{
margin-right: 0;
}
.nav-content ul li a{
text-decoration: none;
color: #fff;
transition: all .4s ease-in-out;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36 Edg/105.0.1343.50
Challenge: Personal Portfolio Webpage - Build a Personal Portfolio Webpage
Link to the challenge: