Landing Page del producto - Construye una página de inicio de producto

Cuéntanos qué está pasando:

termine el examen pero hay tres puntos que me aparecen como error en el nav, intente solucionarlo ordenando con ul y li.Pero no me funciona

Tu código hasta el momento

<!-- file: index.html -->

```<head>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
<header id="header">
  <img id="header-img" src="https://cdn-icons-png.flaticon.com/128/3662/3662817.png">
  <nav id="nav-bar">
    <a href="#Robots" clas="nav-link">robots</a>
    <a href="#seccion_2" clas="nav-link">Inteligia artificial</a>
    <a href="#footer" clas="nav-link">consultas</a>
  </nav>
</header>
<section id="formulario">
  <form id="form" action="https://www.freecodecamp.com/email-submit" method="post">
    <label for="email"> ingrese su correo </label>
    <input id="email" type="email" placeholder="email" required class="input" name="email">
    <label for="nombre">ingrese su nombre</label>
    <input id="nombre" type="text" placeholder="nombre" required class="input">
    <label for="numero">numero de telefono</label>
    <input id="numero" type="number" placeholder="numero de tel" required class="input">
    <input id="submit" type="submit" href="https://www.freecodecamp.com/email-submi"></input>
  </form>
</section>
<section id="Robots"class="seccion">
  <div class="informacion">
    <h2>Los Robots y su futuro</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent fringilla sollicitudin ante quis commodo. Donec molestie, sem ac placerat luctus, neque ligula consequat libero, sit amet iaculis tortor tortor id ex. Nam accumsan erat ac dolor volutpat consectetur. Vestibulum ut urna risus. Phasellus justo leo, lobortis in ultrices et, viverra eget enim. Sed hendrerit tellus at risus consectetur faucibus. Praesent libero quam, ultrices non est eget, aliquam fermentum nisi.
</p>
  </div>
  <div class="video">
    <iframe  id="video" width="100%" height="100%" src="https://www.youtube.com/embed/cpraXaw7dyc?si=nSuQy3VnUhxOlmHK" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
  </div>
</section>
<section id="seccion_2" class="seccion">
  <h2>Inteligia artificial y su futuro</h2>
  <img src="https://cdn.pixabay.com/photo/2015/03/08/09/30/head-663997_1280.jpg" id="img-2">
  <P>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus sit amet sem ut rhoncus. Nulla at feugiat est. Morbi vitae vulputate dolor. Sed at quam tempor, condimentum leo ac, laoreet lacus. Sed a erat et dolor rhoncus tempus. Nullam lacinia finibus enim, eu pretium lorem vehicula nec. Nunc ex nisi, ultrices a varius a, maximus vitae nibh. Proin bibendum augue convallis purus bibendum placerat at in mi. Vestibulum ultrices dignissim urna ac volutpat. Vestibulum placerat dui ac lorem varius pulvinar.</p>
</section>
<footer>
  <h2>! consulta en nuestras redes !</h2>
  <div id="footer" class="seccion"></vid>
  <nav>
    <ul>
      <li><a href="#">instagram</a></li>
      <li><a href="#">facebook</a></li>
      <li><a href="#">tiktok</a></li>
    </ul>
  </nav>
</footer>
</body>

```css
/* file: styles.css */

```*{
  margin:0;
  padding:0;
  font-family:sans-serif;
}
#formulario{
  padding-top:80px;
  margin-top:20px;
}
#header-img{
  width:50px;
  height:50px;
}
#header{
  position:fixed;
  height:80px;
  top:0;
  left:0;
  width:100%;
  background:#cacaca;
  display:flex;
  justify-content:space-between;
  align-items:center;

}
a{
  padding-left:10px;
  color:black;
  text-decoration:none;
  font-weight:700;
}
a:hover{
  color:#5cceee;
}
.seccion{
  height:250px;
  width:100%;
}
#form{
  padding:10px;
}
input{
  margin:5px 0px 5px;
  width:100%;
  padding:10px
}
#robots{
  display:flex;
  height:auto;
}
#seccion_2{
  background:#eee8e8;
  padding:20px 0px;
  text-align:center;
  height:auto;
  width:100%;
}
h1{
  text-align:center;
}
#submit {
  color:white;
  border:none;
  border-radius:5px;
  background:#5cceee;
}
#submit:hover{
  background:#5e9cad;
}
.video{
  width:50%;
}
.informacion{
  margin:10px 0px;
  text-align:center;
  width:50%;
  height:100%;
}
h2{
  margin:10px;
}
footer{
  padding-top:20px;
  text-align:center;
  background:#cacaca;
  height:350px;
}
li{
  padding-top:10px;
  font-weight:700;
}
#img-2{
  padding:10px 0px;
  width:100%;
  height:400px;
}
@media (max-width:600px){
  #nav-bar{
    flex-direction:column;
    text-align:left;
    padding:10px;
  }
}

### Información de tu navegador:

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

### Información del Desafío:
Landing Page del producto - Construye una página de inicio de producto
https://www.freecodecamp.org/espanol/learn/2022/responsive-web-design/build-a-product-landing-page-project/build-a-product-landing-page

Bienvenido al foro @Luciano1124

Tienes un error tipográfico en los nombres de los atributos.

Feliz codificación

1 Like