Twitter Bootstrap - centering brand logo in navbar

itsme picture itsme · Jan 23, 2013 · Viewed 20.5k times · Source

I tryed centering the .brand logo with:

.brand { margin-left: auto; margin-right: auto; }

this is my top navbar layout:

http://jsfiddle.net/J4zkJ/3/

but it seems it doesn't works.

I searched on stack before to post this answer and the code i used above, is taken from an answered question.

Any idea how to center .brand ?

NB: i can't use position:absolute and fixed, and i would like to do this responsively (responsive)

also i tryed this:

.brand { 
  margin:0 auto !important;
  padding:0 auto !important;
  position:absolute !important;
  right:0px;
  left:0px;
   z-index:9999999999 !important;

}

Answer

Sara picture Sara · Jan 23, 2013
.navbar .brand {
  margin-left: auto;
  margin-right: auto;
  width: 60px;
  float: none;
}

I gave it an arbitrary width, set it to whatever you'd like.

jsFiddle