在CSS calc中使用元素的可变宽度

Question

无论元素的宽度如何，如何使用CSS calc（）或预处理器将绝对定位的元素水平居中放置？效果：

.elem {
  position: absolute;
  left:50%;
  margin-left: calc(-.5 * elem.width);
}

我想保留一类绝对定位的元素，其宽度是动态的，相对于其父div水平居中。

Answer 1

left:50%;使用Use将一个绝对定位的元素水平居中translateX。

.elem {
  position: absolute;
  left:50%;
  transform: translateX(-50%);
  /*To align Vertically and Horizontally
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  */
}