Question

我正在尝试创建一个具有position: absolute;且使用百分比定位的元素。问题是，它不是使用中心定位，而是使用左角。有没有办法使用纯CSS做到这一点？该元素是一个弹性框，因此display CSS属性没有花哨的技巧。这是我的代码。

#whateverDiv{
    display: flex;
    left: 25%; /* Uses left corner of element. I want to make it use the center of the element. */
}

此外，这不是here的副本，因为OP要求使用百分比对元素进行居中。我需要将它放在任何位置，例如25%。

Answer 1

如果可以，可以使用css转换

#whateverDiv{
    display: flex;
    left: 25%;
    transform: translateX(-50%)
}

Answer 2

尝试＆＃39; transform-origin＆＃39;也许？

div {
    -webkit-transform-origin: 50% 50%; /* Chrome, Safari, Opera */
    -ms-transform-origin: 50% 50%; /* IE 9 */
    transform-origin: 50% 50%;
}

使用元素中心的位置元素？

2 个答案: