Comment rendre/aligner logo dans le centre en utilisant twitter-bootstrap

Question

Je suis débutant et apprendre le développement web et je l'ai obtenu un svg logo, et je veux le configurer verticalement centre de la barre de navigation. Je ne suis pas sûr de savoir comment le faire correctement.

Problème: l'image/svg sort du navbar-brand.

image a une logo classe où j'ai mis une largeur comme ci-dessous:

.logo { 
    width: 145px; 
} 

Question: Pourquoi mon logo est sortir de la classe parentnavbar brand. En outre, j'ai essayé vertical-align: middle mais cela n'aide pas non plus. Quelqu'un peut-il me guider comment mettre le logo svg, de sorte qu'il reste verticalement centre et ne pas sortir de parent div.

Tentative 1:

vertical-align: middle dans logo classe

Tentative 2:

center-block in navbar-brand

Answer 1

Dans ce jsFiddle il est un exemple pour centrer verticalement le logo

Vertically center logo

line-height: 50px;