bootstrap 3 - how do I place the brand in the center of the navbar?

Question

I am using Bootstrap 3. I would like a navbar with only the brand in it. No other links or anything else. And I want the brand to be in the center. How can I accomplish t

Answer 1

I used two classes to achieve this and maintain responsiveness navbar-brand-left and navbar-brand-center. Keep in mind it utilises Sass / Less Bootstrap for line height, otherwise specify a hardcode px / rem height.

HTML

  


    

      
        Toggle navigation
        
        
        
      
      Brand
    

    

      

        
About
        
How it works
      
      Brand
      

        
Log in
        
Start now
      
    

  

CSS

.navbar-brand-left {
    display: inline-block;
    margin: 0;
    padding: 0;
    line-height: @navbar-height;
}

.navbar-brand-center {
    display: inline-block;
    margin: 0 auto;
    padding: 0;
    line-height: @navbar-height;
}