I am stuck i dont know how to write a nav-link could u help?

i am stuck i dont know how to write a nav-link could u guys help?

I am currently in a free code camp challenge.


i need to:
 * You should have at least 3 `.nav-link` elements within the `#nav-bar`

* Each `.nav-link` element should have an `href` attribute

* Each `.nav-link` element should link to a corresponding element on the landing page (has an `href` with a value of another element's id. e.g. `#footer`)

my code so far:

html:
You should have at least 3 .nav-link elements within the #nav-bar
Failed:Each .nav-link element should have an href attribute
Failed:Each .nav-link element should link to a corresponding element on the landing page (has an href with a value of another element's id. e.g. #footer)

style:
#header {
  position: fixed;
    display: flex;
}

@media screen and (max-width: 992px) {
  body {
    background-color: blue;
    color: white;
  }
}

link to the challenge i am on:

please post your code, we are unable to help otherwise

i am stuck i dont know how to write a
nav-link could u guys help?

I am currently in a free code camp challenge.

i need to:
 * You should have at least 3 `.nav-link` elements 
within the `#nav-bar`

* Each `.nav-link` element should have an `href` attribute

* Each `.nav-link` element should link 
to a corresponding
 element on the landing page (has an `href` 
with a value of another element's id. e.g. `#footer`)

my code so far:

html:
You should have at least 3 .nav-link 
elements within the #nav-bar
Failed:Each .nav-link element should 
have an href attribute
Failed:Each .nav-link element should 
link to a corresponding element on the
 landing page (has an href with a value of another element's id. e.g. #footer)

style:
#header {
  position: fixed;
    display: flex;
}

@media screen and (max-width: 992px) {
  body {
    background-color: blue;
    color: white;
  }
}

this is not your html
there is no html here

please share your code or we are unable to help

<link rel="stylesheet" href="styles.css">
<header id="header">
  <img id="header-img" src="https" > </img>
  <nav id="nav-bar">

  </nav>
  <iframe id="video" src="https"></iframe>
  <form id="form" action="https://www.freecodecamp.com/email-submit">
     <input id="email" name="email" placeholder="text" type="email"></input>
     <input id="submit" type="submit"></input>
  </form>
</header>

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

there is nothing in your nav-bar, what have you tried?

<a href="#header">header</a>

you don’t have any link that brings to the sections of the pages, you don’t seem to have sections to bring to either


that’s what my dad said.

i dont know but its in the free code camp challenge so…

Well, you need to add those elements to your page

ok i thought i had to use the ones that where there> thanks ill try

you need to follow the user stories and create a page that satisfy the tests, to create the page you will need to write many different html elements

is this it?

<link rel="stylesheet" href="styles.css">
<header id="header">
  <img id="header-img" src="https" > </img>
  <nav id="nav-bar">
<a href="#header">header</a>
<a href="#footer">footer</a>
<a href="#menu">menu</a>
  </nav>
  <iframe id="video" src="https"></iframe>
  <form id="form" action="https://www.freecodecamp.com/email-submit">
     <input id="email" name="email" placeholder="text" type="email"></input>
     <input id="submit" type="submit"></input>
     <footer id="footer">
       <h1>hello</h1>
     </footer>
     <menu id="menu">
  <ul>
    <li></li>
  </ul>
</menu>
  </form>
</header>

it didnt work though

you need to use the classes and ids that are written in the user stories and tests for the tests to pass. I don’t see nav-link anywhere

thanks i fixed it.

<link rel="stylesheet" href="styles.css">
<header id="header">
  <img id="header-img" src="https" > </img>
  <nav id="nav-bar">
<a class="nav-link" href="#header">header</a>
<a class="nav-link" href="#footer">footer</a>
<a class="nav-link" href="#menu">menu</a>
  </nav>
  <iframe id="video" src="https"></iframe>
  <form id="form" action="https://www.freecodecamp.com/email-submit">
     <input id="email" name="email" placeholder="text" type="email"></input>
     <input id="submit" type="submit"></input>
     <footer id="footer">
       <h1>hello</h1>
     </footer>
     <menu id="menu">
  <ul>
    <li></li>
  </ul>
</menu>
  </form>
</header>

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.