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

Question

如何使用CSS calc（）或预处理器水平居中绝对定位的元素，无论元素的宽度如何？有什么影响：

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

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

Answer 1

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

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