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
63
votes
10 answers

Center an element in Bootstrap Navbar

No matter what I try, I can't center something in Bootstrap navbar, any solutions for it? I've tried adding a div, using margin:0 auto; or margin-right:auto; margin-left:auto;, used center-block class. Nothing works, why is so hard to achieve…
LuTz
  • 1,493
  • 1
  • 15
  • 25
60
votes
6 answers

Changing the space between each item in Bootstrap navbar

How can I create a larger space between each link on my navbar, so they are further apart? Is it something I change the CSS or HTML? Here's how I've implemented my navbar in the html:
52
votes
14 answers

position:sticky is not working

I have this HTML code:
Description
.header has a height of 150px. .navbar has a height of 20px. When the user scrolls, I want…
Wolfuryo
  • 736
  • 1
  • 7
  • 12
48
votes
7 answers

Bootstrap: How to collapse navbar earlier

I want to collapse my navbar in earlier resolution than 768px, for example 992px, how would I do that? thanks! (I know I can customize it on the bootstrap page, but I don't want to start my project over again with new bootstrap.css file)
Edward
  • 623
  • 1
  • 9
  • 15
48
votes
7 answers

How to justify navbar-nav in Bootstrap 3

I'm attempting to justify a navbar (make the navbar contents stretch) in Bootstrap 3. I've added margin: 0 auto; max-width: 1000px; to the nav* classes, and also attempted to add a container element as a parent to the ul. As a last check, I did what…
josh
  • 9,656
  • 4
  • 34
  • 51
38
votes
4 answers

Flexbox - Justify left and right on the same line

Situation: I have a simple nav bar that I'm building in Flexbox. I want to float one item to the left and keep the others pegged to the right. Example:
37
votes
3 answers

Flutter System Navigation bar and Status bar color

How do I change the system NavBar using Android Studio and flutter? I presume it's not in the main.dart, and I need to go through the android system files, but when I tried to edit the style.xml, the theme editor didn't let me edit any of the…
Tom O'Sullivan
  • 3,416
  • 5
  • 15
  • 27
37
votes
8 answers

Center the nav in Twitter Bootstrap

I want to be able to center the nav dead middle of a page and have it stayed centered in different resolutions. I don't want to use offsets to push it over or margin-left as this would just screw it up in different browser widths. This is the…
pelachile
  • 587
  • 1
  • 5
  • 16
36
votes
6 answers

Bootstrap full responsive navbar with logo or brand name text

I would like to do a full responsive navbar with specified height in Twitter Bootstrap 3.1.1, where the brand could consists of image (logo) or text. html:
35
votes
11 answers

Can't Toggle Navbar in Bootstrap 4 in Angular

Why i can't toggle navbar when resizing to mobile screen in angular 4 using bootstrap 4. I included it in the angular cli in script and styles, the node modules from bootstrap. Is there something missing in my code? Please check below. Is there…
Joseph
  • 7,042
  • 23
  • 83
  • 181
34
votes
2 answers

Correct way to add padding to Bootstrap body to prevent content and header overlap

I understand that to stop the main container in Bootstrap from being at the top of the body, and behind the nav bar, you must add padding like so: