Help with Landing Page/Linking Within The Same Oage

Help with Landing Page/Linking Within The Same Oage
0.0 0

#1

I’m still getting an error on linking within the same page:

  1. When I click a .nav-link button in the nav element, I am taken to the corresponding section of the landing page.’

and my embedded video still registers as an error:

  1. I can watch an embedded product video with id=“video”.

The video I have changed from iframe to video and I still have the same issue which is this:

TypeError: Cannot read property ‘hasAttribute’ of undefined

Can anybody point out where I’m going wrong?

This is my pen

Much obliged,
Nick


#2

The reason you are failing User Story #5, is because the nav-link class should be place on the clickable element (the anchor element).

The reason you are failing User Story #6, is because you are not using the video element properly. See below for proper syntax:

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

Overall your html is a mess. Below I detail out several problems/issues you need to resolve.

#1) You are not properly closing out nested elements before opening others.

For example, the following is not correct syntax:

<strong id="strong-price">$500<span=2em><p id="beta"></span></strong><button>Yes!</button></p>

You have an opening strong tag, followed by an opening span tag, then an opening paragraph tag. So far everything is ok, but then you close off the span tag before closing off the paragraph tag. Also, I assume you think span=2em is going to make the text size of the text inside the span tag 2em? Nope, it will do nothing. You should create a CSS class and assign the value 2em to the font-size property of it and then attach the class to the span element via the class attribute.
The following would be valid:
CSS:

.font2em {
  font-size: 2em;
}

HTML:

<strong id="strong-price">$500<span class="font2em"><p id="beta"></p></span></strong><button>Yes!</button>

Of course you have no text specified for the above paragraph element AND paragraph elements should never be inside span elements anyway, so it should not even be included in the html.

#2) Another problem is the following line:

<input type="submit" id="submit" a href="https://www.freecodecamp.com/email-submit" required></a>

input elements do not have a or href attributes. What were you trying to accomplish here? Where you trying to have the form to submit the information in it to https://www.freecodecamp.com/email-submit? If so, then you should assign the url to the form’s action attribute.

#3) The following ids appear for than once in the document. Ids are supposed to be unique and never should appear more than once in a single page.

The id ‘strong’ appears more than once in the document.

The id ‘strong-price’ appears more than once in the document.


#3

Thanks so much for that. It was really helpful advice!

However, I still seem to be missing something in the area of the linking within the same page.

I’ve done what I think you mean by nesting the div within the anchor element. It links on the same page when I load it up, but the text still shows an error.

I’m unsure what I’m doing wrong in this concern.

Page

Thank you very much for your help.

Best,
Nick


#4

The anchor tags need to have the class of “nav-link”. You should not be nesting the div elements inside the anchor element. You do not need the div elements.


#5

I’m still getting a failure for my User Story #4. The anchor is set to class “nav.link”, so I’m not sure where I’m tripping up. What am I missing?

Nick


#6

Nevermind. I figured it out. All is good. Thanks much @randelldawson