title: Bootstrap image resize for small screen, not working
body: <p>I am trying to resize image using Bootstrap. I have a sufficiently large logo, for large screens &amp; resolutions. Apparently, the image should resize well in all resolutions (small &amp; big resolutions).
  I have used the Bootstrap’s .img-responsive class for making images responsive. As is evident, image shows fine in large resolutions, but the image should become small in smaller resolutions. The problem is that - image is not getting smaller in smaller resolutions.
  Any help would be highly appreciated.</p>
  
  <pre><code>&lt;BODY&gt;
      &lt;nav class="navbar navbar-default"&gt;
          &lt;div class="container-fluid"&gt;
             &lt;div class="navbar-header col-xs-3 col-md-3"&gt; 
                 &lt;a class="navbar-brand" href="#"&gt;
                     &lt;img class="img-responsive" src="someimage.png"&gt;
                 &lt;/a&gt; 
             &lt;/div&gt; 
             &lt;div class="col-xs-9 col-md-9"&gt; 
                 &lt;ul class="nav navbar-nav navbar-right"&gt; 
                     &lt;li&gt;&lt;a href="#"&gt;&lt;img class="img-responsive" src="A1.png"&gt;&lt;/a&gt;&lt;/li&gt; 
                     &lt;li&gt;&lt;a href="#"&gt;&lt;img class="img-responsive" src="A2.png"&gt;&lt;/a&gt;&lt;/li&gt; 
                 &lt;/ul&gt; 
             &lt;/div&gt; 
           &lt;/div&gt; 
      &lt;/nav&gt; 
  &lt;/BODY&gt;
  </code></pre>