title: Image container with fixed size
body: <p>I have the following image container :</p>
  
  <pre><code>&lt;div class="images"&gt;
      &lt;img src="&lt;%=imageURL %&gt;" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And the css for <code>.images</code> is :</p>
  
  <pre><code>.images{
  display:inline-block;
  width:100px;
  height:133px;
  overflow:hidden;
  }
  </code></pre>
  
  <p>My images are of different dimensions thats why I am using the above div capsule to make them same sized. But in the page, my images are coming like this :</p>
  
  <p><img src="https://i.stack.imgur.com/zi6OF.png" alt="enter image description here"></p>
  
  <p>Their tops are not aligned. How can I rectify that ?</p>