title: Vertical-align middle with display table-cell not working on images
body: <p>I'm trying to use the vertical-align: middle on a layout to vertically center sometimes text, sometimes images, but it's only working on text. Can anyone tell me why? </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div&gt;
      &lt;img src="http://jsfiddle.net/img/logo.png"/&gt;
  &lt;/div&gt;
  
  &lt;div&gt;
      &lt;span&gt; text &lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>div{
      width:200px;
      height:200px;
      background-color:red;
      display:table;
  
      margin:10px;
  }
  img, span{
      display:table-cell;
      vertical-align:middle;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/9uD8M/">http://jsfiddle.net/9uD8M/</a> I created a fiddle aswell</p>