Sticky navigation bar

• 

  stgilescathedral · Member · Apr 30, 2020 at 11:07 am

  • Copy link
  • Add topic to favorites

  Hello,

  I would like to make the main navigation bar sticky, but when I try:

  .main-navigation {
  bottom: 0;
  position: sticky;
  }

  Nothing happens.

  Can anyone help?

  The blog I need help with is: (visible only to logged in users)

• 

  alensirola69 · Member · Apr 30, 2020 at 4:01 pm

  • Copy link

  Hi there,

  The theme you are using (Colinear), doesn’t have an option in Customizer for the sticky main navigation bar.

  The position: sticky you used in Custom CSS is a hybrid of relative and fixed CSS positioning.
  The main navigation element (with sticky positioning) is treated as relative positioned until it crosses its container threshold, at which point it is treated as fixed positioned.
  The bottom: 0 won’t apply because of relative positioning treatment (as explained above)

  Usually, sticky navbars are created by using additional javascript, and in case of this theme, there is no such option.

  If sticky navigation is a feature you really need, I would suggest searching for another theme – in WordPress.com dashboard > Themes, scroll down until the search bar, just below the “Advanced themes” and search for “fixed-menu” (without double quotes) and try one of the themes listed.

  I hope this will help you.

  Cheers