Tell us what’s happening:
One of the tests is asking me to create a Nav element with a id equaling navbar. As shown in the code, I did this, but it still is saying I didn’t do it.
Your code so far
<!-- file: index.html -->
<div class="main-content">
<main id="main-doc">
<link rel="stylesheet" href="styles.css">
<div class="container">
<div id="navbar">
<nav id="navbar">
<header>My favorite artists:
</header>
<a class="nav-link" href="#Fredagain..">Fredagain..</a>
<a class="nav-link" href="#Daft_punk">Daft Punk</a>
<a class="nav-link" href="#Kanye_west">Kanye west</a>
<a class="nav-link" href="#Twenty_one_pilots">Twenty one pilots</a>
<a class="nav-link" href="#Radiohead">Radiohead</a>
</nav>
</div>
<section class="main-section" id="Fredagain..">
<header>Fredagain..</header>
<p><li>Fred again is a electronic producer. His most popular song is "Marea (we've lost dancing)" with <code>310,187,601</code> streams and counting on spotify.</li></p>
<p>
<p>Fred again made a historical apperance at the club boiler room. He played music while live looping, and using drum pads to make the drums during the 1 hour preformance.</p>
</section>
<section class="main-section" id="Daft_punk">
<header>Daft punk</header>
<p><li>Daft punk is a french duo that produces house music. Their most popular song is "Get Lucky (Radio Edit) [feat. Pharrel Williams and Nile Rodgers]" with <code>1,043,768,898</code> streams and counting on spotify. </li></p>
<p>Daft punk is one of the most influential bands in the world. They helped shape modern EDM, pop, and many other genres. </p>
</section>
<section class="main-section" id="Kanye_west">
<header>Kanye west</header>
<p><li>Kanye is a rapper and producer. His most popular song is "Heartless" with <code>1,223,403,746</code> streams and counting on spotify.</li> </p>
<p>Kanye is one of the most sucssesfull artists in the world. He holds the most popular song right now (CARNIVAL), and he has one 24 grammys.</p>
</section>
<section class="main-section" id="Twenty_one_pilots">
<header><li>Twenty one pilots</header>
<p>Twenty one pilots is a alternatvie rock, pop duo band from columbus, ohio. Their most popular song is "Stressed out" with <code>2,242,889,838</code> streams and counting on spotify.</li></p>
</section>
<p>Twenty one pilots is a very sucsessfull band. They are 174th most popular band in the world and they have won one grammy.</p>
<section class="main-section" id="Radiohead">
<header>Radiohead</header>
<p><li>Radiohead is a british pop and rock band with 5 members. Their most popular song is "Creep" with <code>1,573,585,198</code> and counting on spotify.</li></p>
<p>Radiohead is one of the most influential bands in the world, being 197th most popular artists in the world, and having won 6 grammys.</p>
</section>
</main>
</div>
/* file: styles.css */
#navbar {
margin-bottom: 10px;
height: 100vh;
width: 200px;
overflow-y: auto;
position: fixed;
left: 0;
top: 0;
}
.nav-link {
display: block;
padding: 10px;
border-left: 1px solid yellow;
border-right: 1px solid yellow;
border-top: 1px solid yellow;
}
.main-content {
margin-left: 200px;
}
@media (min-width: 768px) {
.container {
display: flex;
}
#navbar {
position: static;
height: 100%;
}
.main-content {
flex-grow: 1;
margin-left: 0;
}
}
.nav-link + .nav-link {
border-top: none; /
}
.nav-container {
border: 1px solid #ccc;
}
@media screen and (max-width: 1000px) {
body {
background-color: lightblue;
}
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36
Challenge Information:
Technical Documentation Page - Build a Technical Documentation Page