title: Vertically center a paragraph with unknown number of lines
body: <p>It's not the first time I'm bumping into this problem and never have the opportunity to figure out something right.</p>
  
  <p>So here's the problem:</p>
  
  <p>I have 2 divs. Each of them have a title in them. Depending on the length of the title, the title may have to fit on 2 lines or not. All of this is generated from a CMS, so no way of telling if one of them will have 2 lines or one at a given time (so I can't just separate them with a class if they have 1 line or 2)</p>
  
  <p>Here's the juicy part: I want the title in those two divs centered vertically. Line height won't do it because theres always the possibility of it being on 1 or 2 lines, and display:table-cell + vertical-align:middle is not compatible with IE7.</p>
  
  <p>So is there a way to vertically center those titles and that will work in every browser?</p>
  
  <p>Edit: Heres a photo of the situation I try to explain:</p>
  
  <p><img src="https://i.stack.imgur.com/3ypOM.jpg" alt="enter image description here"></p>
  
  <p>Edit #2: Here's a code sample recreating my example. We want to get them both centered. <a href="http://jsfiddle.net/m7bLj/" rel="nofollow noreferrer">http://jsfiddle.net/m7bLj/</a></p>
  
  <p>Edit #3:</p>
  
  <p>After the answer of @mikhailvs, I came up with this code, that worked.</p>
  
  <pre><code>$(document).ready(function(){
      $(".container-div").each(function(){
          $(this).children('div').css('top', String($(this).height() / 2 - $(this).children('div').height() / 2) + 'px');
      })
  }) 
  </code></pre>