Изображение без изменения размера Bootstrap 3

Question

В настоящее время я использую фреймворк Bootstrap 3, чтобы создать прототип, у меня есть логотип в моем заголовке моего веб-сайта, который, похоже, не изменяет размер. Я дал ему класс, отвечающий за изображение, но он не влияет на него.

Я думаю, что колонка может не содержать содержимое изображения. Я создал скрипку (с заголовком образца изображения выкл Google)

http://jsfiddle.net/pocockn/52VtD/10157/

<!-- navbar and logo --> 
<div class="navbar navbar-default" role="navigation"> 
<div class = "row nav-row"> 
    <div class="col-md-10"> 
     <div class="navbar-header"> 
      <a class="navbar-brand" href="#"><img src ="http://slant.investorplace.com/files/2013/08/pandora-stock-logo.png" class="img-responsive"></a> 
         <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="sr-only">Toggle Navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
     </div> 
     </div> <!-- end of col md 8 --> 
    <div class="col-md-2"> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav nav-stacked"> 
       <li><a href="home.html">ROOMS</a></li> 
       <li><a href="about.html">PROFILE</a></li> 
       <li><a href="artists.html">CONTACT</a></li> 
      </ul> 
     </div> <!-- end of col md 4 --> 
     </div><!-- end of row --> 
    </div><!-- end of container --> 

Спасибо!

Answer 1

Demo Try This я Добавлен класс "логотип", чтобы IMG тег и "remove_pad" к тегу

.logo{ 
    width:100%; 
    height:100%; 
} 

.remove_pad{ 
    padding:0px !importnat; 
} 

Answer 2

Один из способов переопределить непосредственно ваш img с CSS:

Скрипки: http://jsfiddle.net/62uz5odq/

.navbar-brand > img { 
    width:auto; 
    height:100%; 
}