Css 在IE quirks模式下垂直对齐li标记内的多行文本

我正试图找到一个最跨浏览器的解决方案来垂直对齐可以跨越li标记中多行的文本。下面是一个示例

我读了很多关于这个主题的书，根据下面几篇文章，我汇编了下面几篇文章中的代码。这适用于大多数浏览器，但在IE上，当通过开发者工具以怪癖模式推送时，呈现如下：

---

我正在努力找到一个同样适用于IE怪癖模式的解决方案，非常感谢您的帮助

我最近遇到了一个类似的问题。对于这个问题可能有一个更优雅的解决方案，但我解决这个问题的方法是使用一些Javascript/jQuery有条件地设置元素的样式。不幸的是，这要求您通过将class.vCenterIE7（或任何内容）添加到要居中的元素和另一个class.vCenterIE7Rel添加到要居中的元素来更改HTML标记

另外，我知道这不是一个完全可靠的方法来检测用户是否在使用IE7（Modernizer更可靠），但是，如果你仍然在使用IE7，你可能没有操纵你的用户代理设置

脚本：

function vCenterIE7() {
if (navigator.userAgent.toLowerCase().indexOf('msie 7') > -1) {
    var els = $('.vCenterIE7');
    for (var i = 0; i < els.length; i++) {
            var c = els.eq(i);
            var b = c.closest('.vCenterIE7Rel');
            var mtop = b.height() / 2;
            mtop -= c.height() / 2;
            c.css('margin-top',mtop);
    }
}
}

函数vCenterIE7（）{
if（navigator.userAgent.toLowerCase（）.indexOf（'msie 7'）>-1）{
变量els=$（'.vCenterIE7'）；
对于（变量i=0；i

为什么您需要它在怪癖模式下工作？实际上您的问题很好。我面临着一个谜团，我已经最小化了我的代码，或者web应用程序的一部分，使之与我在fiddle中发布的内容完全一致，但是，当我运行应用程序时，对齐错误出现在页面上时，它不会在fiddle中显示。我不知道为什么会这样。此外，该错误仅在标准模式下针对ie8和ie9出现。在fiddle中，bug只在quirks模式下存在，我不知道为什么会出现这种情况，可能是因为normalize.css或我缺少的东西，但我发现，如果有人知道如何在quirks模式下修复它，修复肯定会在OP想要检测quirks模式的页面上工作，而不一定是IE7。怪癖模式是IE5及更早版本中的默认呈现模式，但可能与IE的任何版本有关（我认为最多可达IE9）。在一个次要问题上，我很好奇为什么你没有使用条件注释来针对IE7和纯CSS来解决你的问题？这似乎更可靠/更高效，而且不需要JavaScript。我使用display:table-cell技巧将元素居中。但是IE7不支持很多元素的CSS值，所以我遇到了问题。事实上，我不知道还有其他任何关于垂直居中的干净解决方案（我试图避免CSS表达式），所以我编写了自己的脚本来实现这一点。至于OP，这种方法仍然可以使元素垂直居中，但是如果页面上还没有运行jQuery，那么对于简单得多的东西来说，这是一项巨大的投资。谢谢Nathan，我已经投票支持了你的答案，但我还是更愿意接受只使用CSS的解决方案。此外，如果您的解决方案针对的是IE7，而不是怪癖模式，那么您实际上可以尝试在IE7（标准模式）中使用的东西。奇怪的是，我的问题是从IE8和IE9开始的