I have the out video all things are working but it is still giving me error for video

<html>
<head>
  <link rel="stylesheet" href="styles.css">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Ahmad's Landing page App</title>
  
</head>
<header id="header"><img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/product-landing-page-logo.png" id="header-img">
<br><br>
<nav id="nav-bar">
  <a href="#Features" class="nav-link">
    <button>Features</button>
    </a>
  <a href="#Work" class="nav-link">
    <button>Work</button>
    </a>
  <a href="#Pricing" class="nav-link">
    <button>Pricing</button>
    </a>
</nav>
</header><br><br>
<body>
    <iframe id="video" width="560" height="315" src="https://www.youtube.com/embed/Cmx9AHjKUMk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    
  <form id="form" action="https://www.freecodecamp.com/email-submit">
    <input id="email" name="email" type="email" placeholder="email">
    <input type="submit" id="submit" >
    </form>
    <div id="Features">
      <h1>features</h1>
      <p>hello my name is Ahmad</p>
      </div>
       <div id="Work">
      <h1>Work</h1>
      <p>hello my name is Ahmad</p>
      </div>
       <div id="Pricing">
      <h1>Pricing</h1>
      <p>hello my name is Ahmad</p>
      </div>
      <div class="flex-box">a</div>
    
</body>
</html>

why is this code still giving error for inlcude at least once media query even the video is shown

Salam Ahmad, which step is this code from?

(also I cannot see your CSS file)

1 Like

waslm ok i’ll send you in sec this is the last step of landing page

*{
 top:555px; background-color:#1231;
  margin:0;
  padding:0;
 
}
#header-img{
  width:254px;
}
button{
  background-color:#0000;
  display:flex-end;
  align-items:right;
}
.nav-link{
  text-decoration:none;
}
hover:button{
  color:white;
  background-color:black;
}
#nav-bar{
   position: fixed;
  top: 0px;
  
}
.flex-box{
box-sizing:border-box;
size:55px;
width:55px;
background-color:blue;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 3em 15% 0 15%;
}
#video{
  width:350px;
  margin-top:55px;
}

Can you tell me what error you are getting for the video?

1 Like

this one:- “Your Product Landing Page should use at least one media query.”

Alright, so in style.css just add a media query to one of your element identifiers (to recall, check here for how to write a media query in CSS)

1 Like