CSS变换:转化为对齐中心的DIV不起作用

Question

im使用以下CSS代码div容器

/*media all*/
.rent-a-home-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate( 50%, 50% );
    text-align: center;
}

CSS适用于所有浏览器，但不适合Internet Explorer。带有字体的div不与中心对齐。

在这里您可以看到：https：//www.immvestwolf.de/rent-a-home-2

谢谢！

Answer 1

我使用浏览器Inspector工具看一看，立即看到了问题。显然，Internet Explorer在关闭"(之前留下的空间有问题。因此，正确的语法将是：

transform: translate(-50%, -50%);

而不是

transform: translate(-50%, -50% );

Answer 2

正确的代码将是：

.rent-a-home-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate( -50%, -50% );
    text-align: center;
}

因为没有负50％的代码会将rent-a-home-center分配到右下角，而不是将其转换为左上角，以便DIV的中间点实际上位于页面中间。

链接translate((css文档(具有插图(：https：//developer.mozilla.org/en-us/docs/web/css/transform-function/translate/translate