¿Cómo centrar div absoluto horizontalmente usando CSS?

Tengo un div y quiero que esté centrado horizontalmente, aunque estoy dando que margin:0 auto;no está centrado ...

.container {
    position: absolute;
    top: 15px;
    z-index: 2;
    width:40%;
    max-width: 960px;
    min-width: 600px;
    height: 60px;
    overflow: hidden;
    background: #fff; 
    margin:0 auto;
}

Necesitas configurar left: 0y right: 0.

Esto especifica qué tan lejos para compensar los bordes del margen desde los lados de la ventana.

Al igual que 'arriba', pero especifica hasta qué punto el borde del margen derecho de un cuadro está desplazado hacia el [izquierdo / derecho] del borde [derecho / izquierdo] del bloque que contiene el cuadro.

Fuente: http://www.w3.org/TR/CSS2/visuren.html#position-props

Nota: el elemento debe tener un ancho menor que la ventana o, de lo contrario, ocupará todo el ancho de la ventana.

Si pudiera usar consultas de medios para especificar un margen mínimo , y luego hacer la transición a autotamaños de pantalla más grandes.

.container {
  left:0;
  right:0;

  margin-left: auto;
  margin-right: auto;

  position: absolute;
  width: 40%;

  outline: 1px solid black;
  background: white;
}

<div class="container">
  Donec ullamcorper nulla non metus auctor fringilla.
  Maecenas faucibus mollis interdum.
  Sed posuere consectetur est at lobortis.
  Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
  Sed posuere consectetur est at lobortis.
</div>

Esto no funciona en IE8, pero podría ser una opción a considerar. Es principalmente útil si no desea especificar un ancho.

.element
{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

Aunque las respuestas anteriores son correctas, pero para simplificar a los novatos, todo lo que necesita hacer es establecer el margen, izquierda y derecha. el siguiente código lo hará siempre que se establezca el ancho y la posición sea ​​absoluta:

margin: 0 auto;
left: 0;
right: 0;

Manifestación:

.centeredBox {
    margin: 0 auto;
    left: 0;
    right: 0;
   
   
   /** Position should be absolute */
    position: absolute;
    /** And box must have a width, any width */
    width: 40%;
    background: #faebd7;
   
   }

<div class="centeredBox">Centered Box</div>

Flexbox? Puedes usar flexbox.

.box {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-justify-content: center;
  justify-content: center;

}

.box div {
  border:1px solid grey;
  flex: 0 1 auto;
  align-self: auto;
  background: grey;
}

<div class="box">
  <div class="A">I'm horizontally centered.</div>
</div>

.centerDiv {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align:center;
}

tan fácil, solo use las propiedades margen e izquierda, derecha:

.elements {
 position: absolute;
 margin-left: auto;
 margin-right: auto;
 left: 0;
 right: 0;
}

Puede ver más en este consejo => Cómo configurar el elemento div para centrar en html- Obinb blog

Aquí hay un enlace, use esto para hacer el div en el centro si la posición es absoluta.

HTML:

<div class="bar"></div>

CSS:

.bar{
  width:200px;
  border-top:4px solid red;
  position:absolute;
  margin-left:auto;
  margin-right:auto;
  left:0;
  right:0;
}

Ejemplo jsfiddle

No se puede utilizar margin:auto;en position:absolute;los elementos, simplemente eliminarlo si no lo necesita, sin embargo, si lo hace, usted podría utilizar left:30%;((100% -40%) / 2) y preguntas de los medios de los valores máximo y mínimo:

.container {
    position: absolute;
    top: 15px;
    left: 30%;
    z-index: 2;
    width:40%;
    height: 60px;
    overflow: hidden;
    background: #fff;
}

@media all and (min-width:960px) {

    .container {
        left: 50%;
        margin-left:-480px;
        width: 960px;
    }

}

@media all and (max-width:600px) {

    .container {
        left: 50%;
        margin-left:-300px;
        width: 600px;
    }

}