Make Navigation Bar Sticky on Scroll

[vivek-anand-singh]

Description:

Currently, when scrolling up the page, the navigation bar scrolls out of view. To improve the user experience and accessibility, the navigation bar should remain fixed at the top of the screen, making it easily accessible at all times.

Steps to Reproduce:

1. Open the website.
2. Scroll down the page.
3. Scroll back up, and observe the navigation bar.

Expected Behavior: The navigation bar should remain visible and fixed at the top of the screen during scrolling.

Actual Behavior: The navigation bar scrolls out of view and becomes hidden when scrolling up.

Suggested Solution:

• Implement a sticky navigation bar using CSS. This can be done by setting the position property to sticky and the top property to 0 for the navigation bar element.

Screenshots:

Before scrolling, the navbar looks like this:

But after scrolling, the navbar gets hidden:

[Indrajeety993648]

@ceilican I would like to work on this please assign it to me .