image does vertical center in div

Hi.
I am having use bootstrap. And I have this code:

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">
        <img alt="Brand" src="images/logo.png">
      </a>
    </div>
  </div>
</nav>

HTML:

This is a bootstrap examble http://getbootstrap.com/components/#navbar-brand-image
In the example, the image is centered vertically in navbar.
But, when I use this code my image is does not centered vertically.
Can somebody help me.
there any special considerations for the image?

 

In the example the brand image is definitely on the left...unless you're looking at something else. Anyways try this:
.navbar {
position: relative;
}
.navbar-brand {
position: absolute;
left:50%;
margin-left:-50px!important;/* 50% of your logo width */
display: block;
}

 

You need to use a custom class. Bootstrap doesn't have vertical-center class.

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

Code (CSS):

Source: http://stackoverflow.com/questions/20547819/vertical-align-with-bootstrap-3