Navbar should be at the top - Product Landing Page

HTML-CSS
1

Hello everybody. I’m trying to build my Product Landing Page but I have 15/16 test passed and I have check more times every required step and it seems satisfied .

The problem is the step

#Layout

  • 1. The navbar should always be at the top of the viewport.

I don’t understand what it wants… The navbar is on the top as well as into the example page.

Though the code is almost correct, the page is not formatting yet and it has random content… the result is just a base at the moment (>page). The strange colours you will find are used to help me to understand the behaviour.
Thank you!

2

somethinglike…

nav {
  font-weight: 400;
  position: fixed;
  top: 0px;
  width: 100%;
}
3

You have some funcky nesting going on, you need to clean up your CSS.

If this positioning had been on the nav and there wasn’t some strange nested media query inside it would have worked.

header {
  position: fixed;
  top: 0;
  min-height: 75px;
  padding: 0px 20px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #eee;
  @media (max-width: 600px) {
    flex-wrap: wrap;
  }
}

You also have comments that are not CSS comments.

// This is not how you make a CSS comment

/* This is a CSS comment */
4

You are right! The issue was caused by those comment. Now I have fixed them and it works! Thank you so much!

1 Like
5

Thank you, Xiija! With fixed position it work but after that action it overleaped the logo. I have adjust the original code fixing the comments.
Thank you so much for the check!

1 Like