Product Landing Page - Build a Product Landing Page

I did it 3 times, always makes me the same corrections. Can´t get it!Help me please!

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description"content="landing page"/>
    <title>Product Landing Page</title>
    <link rel="stylesheet" href="style.css">
   </head>
  <body>
    <div class="page-wrapper">
<header id="header">
  <div class="logo">
  <img id="header-img"src="https://photos.google.com/u/1/photo/AF1QipOsnUeRAfsKwwFDF5xXoUP-xiEf6Y3IGl9Erm5s"alt="logo San Jose"
</div>
  <nav id="nav-bar">
    <ul>
        <li>
          <a class="nav-link"href="#informacion">Información</a>
          </li>
           <li>
        <a class="nav-link"href="#productos">Productos</a>
        </li>
          <li>
            <a class="nav-link"href="#ellos">Ellos</a>
            </li>
            </ul>
            <h1>Bienvenidos</h1>
<div class="contenedor">
<div class="info" >
<h2>Conocenos!</h2>
<h3 id="informacion">Informacion</h3>
<p>Tienda para Mascotas San Jose
Suministros para mascotas
📲 3516331087 - ☎️ 4587388
Servicio veterinario 👨‍⚕️- Balanceados 🍴 - Juguetes y accesorios 🥏 Peluquería Canina 🧽🧼</p>
<img id="perro" src="https://www.instagram.com/p/CiH_zcSs3Q0/?hl=es" alt="perro tierno">
</div>
<div class="productos">
  <h3 id="productos">Productos</h3>
  <div class="fotos">
  <img src="https://www.instagram.com/p/CmrsdtVOYEC/?hl=es"alt="correas">
  <img src="https://www.instagram.com/p/Cj3jZvLOJVr/?hl=es"alt="peluqueria">
  <img src="https://www.instagram.com/p/CRhEulDt9mk/?hl=es"alt="atencion veterinaria">
  <img src="https://www.instagram.com/p/CdVz6ViMAhS/?hl=es"alt="balanceado">
  </div>
</div>
<div class="video">
  <h3 id="ellos">Ellos</h3>
  <iframe id="video"src="https://www.instagram.com/p/CI6LjHoHiie/?hl=es"alt="cachorro"></iframe>
  </div>
  <br>
   <h3>Dudas?</h3>
  <form id="form" action="https://www.freecodecamp.com/email-submit">
 
  <input id="email"type="email"name="email"placeholder="Escribe tu Email"required>
  <input id="submit"type="submit"value="enviar">
  <p>Nos contactaremos a la brevedad</p>
  <p>Gracias!</p>
</form>
</div>
    </body>
    </html>
/* file: styles.css */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    head{
      display: none;
    }
    body {
    background-color: #eee;
    font-family: sans-serif;
    display: block;
}
.page-wrapper {
    position: relative;
}
.logo{
  width: 25%;
}
nav{
  font-weight: 400;
  display: block;
}
nav > ul {
    width: 50%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}
ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}
li {
    list-style: none;
        display: list-item;
    text-align: -webkit-match-parent;
    }
  header {
    position: fixed;
    top: 0;
    min-height: 75px;
    padding: 0px 20px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: #eee;
    width: 100%;
}
h1{
  font-weight: bold;
}
.contenedor{
  display: flex;
  width: 100%;

}
p{
  text-align: center;
}
#perro{
  display: flex;
  justify-content: center;
}
.productos{
  display: flex;
flex-wrap: wrap;
gap: 20px;
}
.fotos{
  width: 50%;
padding: 20px;
border-radius: 10px;
}
.video{
overflow-clip-margin: content-box !important;
    border-width: 2px;
    border-style: inset;
    border-color: initial;
    border-image: initial;
    overflow: clip !important;
}
@media (max-width: 350px) {
  #video {
    width: 300;
    height: 200;
  }

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36

Challenge: Product Landing Page - Build a Product Landing Page

Link to the challenge:

It looks like you have a couple of issues

In the HTML you need to link to the correct css file name

It should be styles.
Not style

In your CSS, it looks like you have some issues here

It looks like you are missing a closing curly brace for the * selector.

I am not sure what this is supposed to be here

Maybe you meant header instead?
Remember that the head element is for the meta data.

Hope that helps!

thank you very much, your help was what I needed!!

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