Tú #nav-bar siempre debe estar en la parte superior del viewport

Cuéntanos qué está pasando:
Describe tu problema en detalle aquí.

  **Tu código hasta el momento**
/* file: index.html */
<html>
<head>
  
  <style>
    #header-img {
      width: 150px;
    }
  </style>
</head>

<body>

<header id="header">
  <nav id="nav-bar">
    <a class="nav-link" href="#leer-mas">Leer Mas</a>
    <a class="nav-link" href="#cupon-descuento">Cupon de descuento</a>
    <a class="nav-link" href="#comprar-amazon">Comprar en Amazon</a>
  
  </nav>  
   
  <img id="header-img" src="https://i.pinimg.com/originals/21/aa/e3/21aae324d1ba626b4b19c9bbe4b4c834.png">
 
</header>

<section id="leer-mas">
  <iframe id="video" width="200" height="200" src="https://www.youtube.com/embed/Fc2koNqnFMw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</section>
<section id="cupon-descuento">
  <form id="form" action="https://www.freecodecamp.com/email-submit">
    <input id="email" type="email" name="email" placeholder="email@gmail.com">
    <input id="submit" type="submit"></input>
  </form>  
</section> 
<section id="comprar-amazon"></section>  
<h1>Que la gente crea</h1>

</body>
</htmal>
/* file: styles.css */

  **Información de tu navegador:**

El agente de usuario es: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36

Desafío: Construye una página de aterrizaje de producto

Enlaza al desafío:

Where is all your CSS?

The nav or header has to be positioned using fixed or sticky so it remains at the top of the page when it is scrolled.

i have the same problem and still doesn’t work

Without seeing your code we can’t help.

body{
background-color: rgb(199, 227, 227);
color: red;
flex: auto;
display: flex;

}

#header-img{
width: 50%;
display: flexbox;
flex-direction: row;

}
#header{
position: fixed;
display: flex;
justify-content: space-around;
align-items: center;

}
#nav ul{
display: flex;
flex-direction: row;

}
#nav-bar{
display: flexbox;
flex-direction: row;

@media (max-width: 500px){
body{

background-color: red;

}
#header-img{
width: 70%;
}
}

Te recomiendo crear una pregunta aparte y compartir tanto el código HTML como el codigo CSS

El código html está correcto, solo te falta agregar el código css

La barra de navegación tiene que tener esta función:
https://product-landing-page.freecodecamp.rocks/
Aunque bajes la página, la barra de navegación siempre tiene que ser visibl

El código html está correcto, solo te falta agregar el código css

La barra de navegación tiene que tener esta función:

https://product-landing-page.freecodecamp.rocks/

Aunque bajes la página, la barra de navegación siempre tiene que ser visible