title: How to set size of image to match bootstrap thumbnail?
body: <p>As you can see, the right image is not fitted properly into my thumbnail</p>
  
  <p><img src="https://i.stack.imgur.com/9LsXy.png" alt="enter image description here"></p>
  
  <p>Whats weird is that both images are the exact same resolution (apparently from google images)</p>
  
  <pre><code> &lt;div class="jumbotron"&gt;
     &lt;div class "container"&gt;
      &lt;h1&gt;In Your Shoes:&lt;br&gt; Make Connections Anonymously&lt;br&gt; &lt;/h1&gt;
       &lt;h2&gt;
        &lt;div class="row"&gt;
          &lt;div class="col-xs-4 col-md-4 col-lg-4"&gt;
            &lt;a href="#" class="thumbnail"&gt;
              &lt;%= image_tag("blank_avatar_male.jpg") %&gt;
            &lt;/a&gt;
           &lt;/div&gt; 
            &lt;div class="col-xs-4 col-md-4 col-lg-4"&gt;
             &lt;a href="#" class="thumbnail"&gt;
               &lt;%= image_tag("img_thing.jpeg") %&gt;
             &lt;a/&gt;
            &lt;/div&gt;
            &lt;div class="col-xs-4 col-md-4 col-lg-4"&gt;
             &lt;a href="#" class="thumbnail"&gt;
             &lt;%= image_tag("blank_avatar_female.jpg") %&gt;
             &lt;/a&gt;
            &lt;/div&gt;
           &lt;/div&gt; 
        &lt;/h2&gt; 
  </code></pre>
  
  <p>I know the html code doesnt look pretty, as I'm doing this myself.
  I'm open to suggestions on how to improve it! Thanks</p>