Build a Product Landing Page Embed video error

Help! Nothing is working. I’m unable to embed video:

               <div class=iframe-container">
            <iframe width="560" height="315" src="" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>  


  .iframe-container {
     position: relative;
     width: 100%;
     padding-bottom: 56.25%; 
     height: 0;
.iframe-container iframe{
     position: absolute;
     left: 0;
     width: 100%;
     height: 100%;

I keep getting this message after trying mutiple methods of embedding…

error message 13 6. I can watch an embedded product video with id=“video”.

#video is not defined : expected null to not equal null AssertionError: #video is not defined : expected null to not equal null

one of many video instructions I followed

Your code so far

**Your brow AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.157 Safari/537.36.
Link to the challenge:

If I add the appropriate id to an element other than the relevant one, I get a very similar error.

From the test error message I get…

I can watch an embedded product video with id="video".
#video should be an <iframe> or <video> element 

This tells you exactly what’s missing.

I’m sorry. I thought this was for video’s other than Youtube.

  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.

I can watch an embedded product video with id=“video”.!! yups! go

Move the id="video" from the section element to the iframe element.

1 Like

For the last test, you can add what you have on the nav to the header as well. But you have a lot of errors in the CSS you will need to fix some of them first.

  1. You have a style element (<style>) in the CSS at line 29

  2. Head is not a valid element selector line 30

  3. This is not a CSS comment <!--add for flex--> at line 41 (/* this is a CSS comment */)

  4. The body selector block is not closed correctly.

  5. You have invalid syntax for the background image

background-image: url (
        alt=Little Rock);

Should be:

background-image: url(;

If you replace the CSS for the three selectors below with this it should pass the last test.

body {
  width: 100%;
  height: 300px;
  background-image: url(;
  background-repeat: no-repeat;
  background-size: contain;
  border: 1px solid red;
  background-color: dodgerblue;
  margin: 0px 50px 50px;

h2 {
  text-align: center;

#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  1. Use the down arrow on the CSS code box and from the menu click “Analyze CSS”, fix any errors.

Your a boss. The solution was so simple, Thanks a lot.