Help: product landing page nav-bar nav-links

can you paste the full text of the error? Sometimes it gives a clue as to what it didn’t find in the assertion string.

  1. The navbar should always be at the top of the viewport. AssertionError: #header or one of its children should be at the top of the viewport even after scrolling : expected 256.5555725097656 to be close to 0 +/- 15
    at Function.assert.approximately (https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js:18812:36)
    at n. (https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js:21809:23)
    at r (https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:7852)
    at r.run (https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:8853)
    at i.runTest (https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:13553)
    at https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:14192
    at r (https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:13024)
    at https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:13000
    at n (https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:12791)
    at https://cdnjs.cloudflare.com/ajax/libs/mocha/3.0.2/mocha.min.js:2:12855

ah, try using “top: 0 !important” to force your navbar to the very top of the page.

apparently it is not within the 15 pixel range at the moment…

I’ll try, but I can’t figure out for the life of me why the exact same code passes on CodePen. It’s again something in Github is not using Bootstrap, where I think the nav-bar formatting is coming from.

oh, in that case, i wouldn’t worry about it. If you plan to refer to the codepen in your certificate, then that’s all you need.

OK, I’ll use the CodePen link then, but even thought it passes, it shifts my nav-bar to the left margin at the top - and that looks goofy, and bad.

the one thing i know about codepen is that you need to make sure you’re importing things correctly. so instead of using import statements for eg. you should shift those out into the settings for the css /html / js etc.

what’s you codepen link?

I fixed the menu issue by remove the doctype and head and replacing them with html settings in codepen

https://codepen.io/hbar1st/pen/jKgjrL

here’s the forked code. (fork it again to just use it or look at the html settings to see what I did and do the same )

Did you just get rid of my tag, and the full tag? Just to know.

I got rid of the doctype and <html> and <head> and links. instead I defined the links in the settings for the html file (there is a settings icon which looks like a cog wheel. if you click that you can see the settings I added)

You’re the best, twice!

1 Like

https://codepen.io/diane-nelson-trotter/pen/zQzPJZ