Poloroid Landing Page

Hi I am trying to complete my 4th Project, the landing page. I am struggling with passing one test of the Navbar always staying at the top. Forgive me if the fix seems obvious but I haven’t worked out what I need to do.

https://codepen.io/mcfeegles/pen/WNwmaMG

I would love any additional advice of how to make the project better. Thanks in advance.

@mcfeegles The project looks very nice! On my end, the test isn’t passing but the nav is staying at the top. I don’t know what the problem is. Make sure all of the links are in the header. Also, it looks like you misspelled polaroid on your page, something to fix. Happy Coding! :smile:

I think the test is looking for a code in navbar CSS like

navbar{
position: fixed;
top:0;}

because these codes make the navbar fixed on the top of the page.

Welcome to the forums @mcfeegles. Your page looks good. Some things to revisit;

  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should be aware of and address.
      • You can ignore the warnings for now.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Codepen provides validators for HTML, CSS and JS. Click on the down arrow in the upper right of each section and then click on the respective ‘Analyze’ link.
    • The one for CSS is good. Use it and address the issue(s).
      • be wary of duplicating selectors
    • (The one for HTML misses things which is why I recommend W3C)
  • Make your page responsive. Remember, the R in RWD stands for Responsive.
    • There’s a horizontal scrollbar on smaller screens

Ahh thanks, yes that was what was looking for.

Thank you for your help. I have bookmarked the W3C validator for later.
I also didn’t know about codepens validators so that is a load of help.

I see the horizontal scroll bar- it is the you tube video, so I will fix that.

Thanks a lot, I am no designer so I am glad that it looks nice. Thanks for the spelling correction- I’m dyslexic so I need all the help I can get lol :rofl: