css - 垂直居中的 Jquery 幻灯片在 Firefox 中不起作用

Question

我的 JQuery UI 垂直幻灯片在 Firefox 中不起作用，因为它display:table-cell用于.label垂直居中文本。

请参阅：JSFiddle

如何在 Firefox 中修复但保持垂直居中？

Answer 1

只需在标签之外创建一个 div 并为 div 设置动画：

HTML：

<div id="labels">
    <div>
    <p class="label" data-groupl="1">Vertically centered text</p>
    </div>
</div>

jQuery：

$(".label").parent().show("slide", { direction: "right" }, 1000);