title: Vertically align text within a div
body: <p>The code below (also available as <a href="http://jsfiddle.net/9Y7Cm/3/" rel="noreferrer">a demo on JS Fiddle</a>) does not position the text in the middle, as I ideally would like it to. I cannot find any way to vertically centre text in a <code>div</code>, even using the <code>margin-top</code> attribute. How can I do this?</p>
  
  <pre><code>&lt;div id=&quot;column-content&quot;&gt;
      &lt;img src=&quot;http://i.stack.imgur.com/12qzO.png&quot;&gt;
      &lt;strong&gt;1234&lt;/strong&gt;
      yet another text content that should be centered vertically
  &lt;/div&gt;
  </code></pre>
  
  <pre><code>#column-content {
      display: inline-block;
      border: 1px solid red;
      position:relative;
  }
      
  #column-content strong {
      color: #592102;
      font-size: 18px;
  }
  
  img {
      margin-top:-7px;
      vertical-align: middle;        
  }
  </code></pre>