将具有未知行数的段落垂直居中

Question

这不是我第一次遇到这个问题而且从来没有机会找出正确的事情。

所以这就是问题所在：

我有2个div。他们每个人都有一个标题。根据标题的长度，标题可能必须适合2行或不适合。所有这些都是从CMS生成的，因此无法判断其中一个是否会在给定时间内有两行或一行（因此，如果他们有一行或两行，我不能将它们与一个类分开）

这是多汁的部分：我希望这两个div中的标题垂直居中。行高不会这样做，因为它总是有可能在1行或2行，并且显示：table-cell + vertical-align：middle与IE7不兼容。

那么有一种方法可以将这些标题垂直居中并且可以在每个浏览器中使用吗？

编辑：下面是我试图解释的情况照片：

编辑＃2：这是重新创建我的示例的代码示例。我们希望让他们都集中。 http://jsfiddle.net/m7bLj/

编辑＃3：

在@mikhailvs的答案之后，我提出了这个代码，它有效。

$(document).ready(function(){
    $(".container-div").each(function(){
        $(this).children('div').css('top', String($(this).height() / 2 - $(this).children('div').height() / 2) + 'px');
    })
}) 

Answer 1

如果你愿意使用jQuery，你可以这样做：

var div1onLoadCallback = function () {
     var w = $(window);
     var div1 = $('#div1');
     div1.css('top', String(w.height() / 2 - div1.height() / 2) + 'px');
}

然后宣布你的div为<div id="div1" onload="div1onLoadCallback()"></div>

和第二个div类似。粗略的，您需要修改标题的css position属性才能生效（例如position: absolute）。