Product landing page help

pls help me with the user story 13 i.e.,
. 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 122.3125 to be close to 0 +/- 15
code-pen: https://codepen.io/gauravrock/full/MXJmyq/
pls, fork if there is any other issue & pls share it?

They just expect this:

#header{
  position: fixed;
  top: 0;
}

that will make your navigation fixed to the top.

4 Likes

@sorinr can i fix on top with the help of bootsrap class or CSS only>>

yes you can. just read the bs docs on how to do that

If you are using bootstrap then you can use class="fixed-top"

@sorinr
it can be done by adding the class “fixed-top”
but it’s not working in codepen whereas it works in local editor. And fixing it via CSS doe the job!!

in codepen->settings->css part do not load both bs4 and bs3. just bs4 its enough. think the fixed-top class was named differently in bs3 and as you load it after bs4 some of the classes did not work as expected.

1 Like

thanks a lot @sorinr you are right bs3 and bs4 just override…u helped solving the issue:crazy_face::muscle:t2::+1:t2:

You are very welcome. Happy coding :+1:

there is one more issue if u can just help me with…

the heading "Quality " with paragraph benaeth it cannot have some margin-right property applied …can u help me sought that out!! :disappointed_relieved:

Hate to necro but this is the reply that fixed things for me. Why is this the case? If I haven’t specified anything before this in the layout surely it should go to the top? It was annoying me that I could see a slim bit of text scrolling behind my “position: fixed” test and this fixed things, I’d just like to understand why?