Geek Answers Handbook

Bootstrap fixed navbar inside div

In the boot documentation, they can "trap" .navbar-fixed-top inside their .bs-docs-example div:

 <div class="bs-docs-example bs-navbar-top-example"> <div class="navbar navbar-fixed-top" style="position: absolute;"> <div class="navbar-inner"> [...]

But if I do the same on my test page, the navbar will “slip away” from the div and lock into the top of the body, not the top of the div. How is this achieved?

+6
source share
2 answers

Well understood. The container of the parent element must have position: relative , and navbar should have position: absolute , so if you attach either .navbar-fixed-top or .navbar-fixed-bottom , it will be fixed relative to the parent element and NOT relative to the whole page . Yes!

+10
source 
 <div class="container-fluid"> <div class="container"> <nav class="navbar">...</nav> </div> </div>

This works with the built-in Bootstrap CSS.

0
source

More articles:


All Articles