Sticky Navbar Not Fixed in Smaller Viewports - Githubissues

jpham93 / portfolio

My portfolio site

0 stars 0 forks source link

Sticky Navbar Not Fixed in Smaller Viewports #5

Closed jpham93 closed 5 years ago

jpham93 commented 5 years ago

Sticky menu does not stay sticky in smaller screens.

Expected Behavior: The Navbar should stay in a fixed position attached to the top after scrolling down past the header.

Actual Behavior: When the screen scrolls down past a certain position, the fixed position changes to the absolute position and therefore the Navbar is no longer in the viewport.

Screen Shot 2019-08-27 at 6 29 55 AM

Screen Shot 2019-08-27 at 6 31 01 AM

[x] Either change the outside container from "bound-container" to "stuck-container" or change inner div from "position : absolute" to "position : fixed" and "top" to 0 versus bottom.
[x] Test in both full screen and mobile views.

jpham93 commented 5 years ago

Fixed by adding position: fixed + top: 0. Removed <Sticky /> component.