title: vertical-align image in div
body: <p>i have problem with image vertical-align in div</p>
  
  <pre><code>.img_thumb {
      float: left;
      height: 120px;
      margin-bottom: 5px;
      margin-left: 9px;
      position: relative;
      width: 147px;
      background-color: rgba(0, 0, 0, 0.5);
      border-radius: 3px;
  }
  
  .img_thumb img {
      display: block;
      margin-left: auto;
      margin-right: auto;
      vertical-align: middle;
  }
  
  &lt;div class="img_thumb"&gt;
      &lt;a class="images_class" href="large.jpg" rel="images"&gt;&lt;img src="small.jpg" title="img_title" alt="img_alt" /&gt;&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As far as i know i need "display: block;" to position image in center and that works.
  Also in tutorials i find many answers but they are not "useful", because all of my image are NOT at the same height!</p>