Please help : viewport (1 requirement left)

Hello, could I please get some help with this?
I’d appreciate it.   :slight_smile:

FreeCodeCamp Product Landing Page (Project 3)

Missing Requirements

  1. (5/16 required) When I click a .nav-link button in the nav element, I am taken to the corresponding section of the landing page.

  2. (Layout, 1/16 required) The navbar should always be at the top of the viewport.

1: there is only a <li class="nav-link"><a class="nav-link"> in the HTML to be found. Is that what they are asking for are u sure its to the POINT?

2: The #submit element input type is incorrect : expected ‘text’ to equal ‘submit’
this is not the case
although the #submit is in the form the type isn’t valid

3: Take a look at ure css why are u using
.box4
.box
but now nav???

I don’t understand what is your problem exactly, it’s seems you are doing well. you just need to style the page.

Hello, I am still needing help. I figured out 2 of the requirements. I just have one more question to go.

CodePen FCC: Product Page (Project 3)
CodePen Live View

Last Requirement: The navbar should always be at the top of the viewport.

@jkhov002, the simple answer is it’s failing because you haven’t set it to be at the top. I’ll go into more details but first, you have some things you need to clean up with your HTML code.

  • First off, a proper HTML page will only have one body element. You have two.
  • Codepen only expects the elements you’d but in the body element in the HTML section. You don’t need to include the body tags.

When the test runs it’s looking at the first header element on line 67 in your code and of course it will not pass.
What I did to get the test to pass was comment out lines 49 through 57 in your HTML code.
In your nav declaration (line 25 in your CSS section) I added the following two lines

position: fixed;
top: 0;

All tests now pass.

You should run your HTML code through the W3C validator. There are a few HTML coding errors you should be aware of and correct.

Hope this helps.

1 Like

Hello Roma,

Thank you for so clearly spelling out what the issue was.
I appreciate your help. I’ve since deleted the duplicate body tags. I kept thinking the first header element was just the navbar id.