taller navbar breaking the docking position of scrollspy in bootstrap

StackOverflow https://stackoverflow.com/questions/16169679

  •  11-04-2022
  •  | 
  •  

Question

I want to change the height of my navbar without breaking the fixed docking behavior off scrollspy in twitter bootstrap. Where can I ajust this setting? Changing the offset property of the nav element doesn't seem to do the trick.

Here is an example of the sub nav docking correctly before the navbar height change, if you scroll down you will see the nav bar docking:

http://www.pictorious.com/about

However, as soon as I make the navbar taller the sub nav will tuck completely underneath thinking it's the nav is the same height as before.

Was it helpful?

Solution

Starting at line 174 in main.css you have: 

.subnav-fixed {
  position: fixed;
  top: 40px;
  ....
}

Have you tried changing top: 40px to the new height of your main nav bar?

You might also want to adjust the value of data-offset in 

<body data-spy="scroll" data-target=".subnav" data-offset="50">
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top