垂直居中不在firefox中工作

Question

我正在使用父容器垂直居中div。

http://danacoleproducer.com

适用于Safari和Chrome，但不适用于Firefox。我查看了这篇文章：CSS vertical-align: middle not working但我宁愿不使用表格。

我的CSS：

.wrapper {
    height: 100%;
    max-width: 420px;
}
.wrapper:before,
.container {
    display: inline-block;
    vertical-align: middle;
}
.wrapper:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 100%;
    vertical-align: middle;
    margin-left: -0.25em;
}
.container {
    text-align: justify;
    font-size: 12px;
}

Answer 1

以下可能会成功;-)

.container {
position: relative;
top: 50%;
transform: translateY(-50%);
}

其中.container是你想要垂直居中的地方。