Questions tagged [navbar]

The portion of HTML and XML that deals directly with page navigation

A navigation bar or (navigation system) is a section of a website or online page intended to aide visitors in travelling through the online document.

source: http://en.wikipedia.org/wiki/Navbar

6050 questions
744
votes
12 answers

Change navbar color in Twitter Bootstrap

How would I go about modifying the CSS to change the color of the navbar in Twitter Bootstrap?
Jamal Khan
  • 9,371
  • 6
  • 23
  • 23
613
votes
14 answers

Bootstrap NavBar with left, center or right aligned items

In Bootstrap, what is the most platform-friendly way to create a navigation bar that has Logo A on the left, menu items in the center, and Logo B on the right? Here is what I've tried so far, and it ends up being aligned so that Logo A is on the…
Aliv
  • 6,155
  • 3
  • 12
  • 6
392
votes
29 answers

Bootstrap 3 Navbar with Logo

I want to use the Bootstrap 3 default navbar with an image logo instead of text branding. What's the proper way of doing this without causing any issues with different screen sizes? I assume this a common requirement, but I haven't yet seen a good…
stepanian
  • 11,373
  • 8
  • 43
  • 63
311
votes
26 answers

How to set bootstrap navbar active class with Angular JS?

If I have a navbar in bootstrap with the items Home | About | Contact How do I set the active class for each menu item when they are active? That is, how can I set class="active" when the angular route is at #/ for home #/about for the about…
user1876508
  • 12,864
  • 21
  • 68
  • 105
258
votes
8 answers

Align nav-items to right side in bootstrap-4

I just switched to bootstrap 4 and reworking all my html and scss to work with it and I cant seem to find how to put a group of nav-items on the right side of the navbar. This is my navbar code:
235
votes
12 answers

Center content in responsive bootstrap navbar

I'm having trouble centering my content in the bootstrap navbar. I'm using bootstrap 3. I've read many posts, but the CSS or methods used will not work with my code! I'm really frustrated, so this is like my last option. Any help would be…
Nick lK
  • 2,647
  • 4
  • 16
  • 14
234
votes
18 answers

How to change Bootstrap navbar collapse breakpoint

Currently when the browser width drops below 768px, the navbar changes to collapsed mode. I want to change this width to 1000px so when the browser is below 1000px the navbar changes to collapsed mode. I want to do this without using LESS, I am…
Nearpoint
  • 7,202
  • 13
  • 46
  • 74
212
votes
12 answers

Bootstrap 3 Navbar Collapse

Is there any way to increase the point at which the bootstrap 3 navbar collapses (i.e. so that it collapses into a drop down on portrait tablets)? These two were applicable to bootstrap 2 but not now! How to change navbar collapse threshold using…
timhc22
  • 7,213
  • 8
  • 48
  • 66
149
votes
8 answers

How can I reuse a navigation bar on multiple pages?

I just finished making my home/index.html page. To keep the nav bar where it is, and have it stay while users click through all my pages. Do I have to copy and paste the nav code to the top of each page? Or is there another way to do so that would…
blackRob4953
  • 1,585
  • 2
  • 12
  • 15
113
votes
13 answers

navbar color in Twitter Bootstrap

How can I change the background color of the navbar of the Twitter Bootstrap 2.0.2? How can I change color of all the elements of the navbar to reflect the background color?
Gattoo
  • 3,019
  • 7
  • 25
  • 21
110
votes
9 answers

How to use the new affix plugin in twitter's bootstrap 2.1.0?

The bootstrap documentation on that topic is a little confusing to me. I want to achieve similar behaviour like in the docs with the affix navbar: The navbar is below a paragraph / page heading, and upon scrolling down it should first scroll along…
Dynalon
  • 6,577
  • 10
  • 54
  • 84
108
votes
9 answers

Decreasing height of bootstrap 3.0 navbar

I am trying to decrease bootstrap 3.0 navbar height which is used with fixed top behavior. Here i am using code. HTML
91
votes
6 answers

Bootstrap 3 - disable navbar collapse

This is my simple navbar:
71
votes
17 answers

Change color of bootstrap navbar on hover link?

I want to know how to change the color of the links when you hover over them in the nav bar, as currently they are an ugly color. Thanks for any suggestions? HTML:
67
votes
5 answers

Twitter-Bootstrap-2 logo image on top of navbar

Can someone suggest how I can place a logo image on the top of the navbar? My markup:
1
2 3
99 100