CodePen

HTML

            
              <article>
  <a href="#">
    <div class='meta'>
      <p class='title'>This is an example title spanning multiple lines</p>
      <p class='author'>By Jon Smith</p>
    </div>
    <img src="http://lorempixel.com/320/125/animals" />    
  </a>
</article>

<article>
  <a href="#">
    <div class='meta'>
      <p class='title'>This is just another example title spanning more lines this puppy can handle</p>
      <p class='author'>By Jon Smith</p>
    </div>
    <img src="http://lorempixel.com/320/340/animals" />    
  </a>
</article>

<article>
  <a href="#">
    <div class='meta'>
      <p class='title'>This is one more example title spanning so many lines that it makes this tiger curious about how this freakin' thing has been accomplished in the first place</p>
      <p class='author'>By Jon Smith</p>
    </div>
    <img src="http://lorempixel.com/320/640/animals" />    
  </a>
</article>
            
          
!
via HTML Inspector

CSS

            
              body {
  background: #262;
  text-align: center;
}
article {
  background: #FFF;
  display: inline-block;
  width: 320px;
  margin: 1em .5em;
  padding: 10px;
  border: 1px solid #ccc;
  position: relative;
  vertical-align: middle;
  box-shadow: 0 0 1em black;
}
article a {
  display: block;
  background: #000;
  color: #fff;
  font-size: 0;
  text-align: center;
}
article .meta {
  vertical-align: middle;
  position: relative;
  z-index: 2;
  display: inline-block;
  margin-right: -100%;
  font-size: medium;
  width: 100%;
}
article .meta .title {
  font-size: 1.5em;
  padding: .25em;
}
article img {
  display: inline-block;
  width: 100%;
  opacity: .5;
  z-index: 1;
  vertical-align: middle;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              // http://css-tricks.com/forums/discussion/24406/how-to-vertically-center-multi-lined-text-in-fluid-responsive-thumbnail-image#Item_5
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................