How to set content below header, if header is fixed?

What is your hint or solution suggestion?
User Story #13: The navbar should always be at the top of the viewport.
User Story #12: When I click the #submit element, the email is submitted to a static page .

My question is that if , I am doing User Story 13 then all the elements and contents of my landing page float to the top then,

“How I change the CSS properties so that all the content align to the top to bottom except header (fixed)?”

And second is I had already set the url given to my form but User Story 12 is not passed. So anyone help me ?

Here’s the my Page Link

Challenge: A product Landing Page

Link to the challenge:

Hi @madansinha!

For user story 12 it says
“The #email input should have a name attribute : expected false to equal true”

Once you add that then the test will pass.

For user story 13
#header or one of its children should be at the top of the viewport even after scrolling”

Your navbar needs to be fixed at the top at all times. There is a helpful position in css that will make the navbar stay in one place.

Hope that helps!

@jwilkins.oboe Thanks a lot but I got it.

Try this:

#header{
  position: fixed;
  z-index: 10;
  width: 100%;
  top: 0;
}

For CSS, you can ‘play’ with developer console in the browser, try changing it one property at a time.

thanks❤ bro, I got it.