Como dicen, tienes que especificar que mida 100%. Esto es así debido a que al posicionar el elemento de forma absoluta se pierde la anchura automática del elemento en bloque —auto.
Probablemente también necesitarás centrarlo dependiendo de su anchura, que no conocerás. Luego podrías usar
transform, entonces te quedaría algo así:
Código CSS:
Ver original.caja {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
min-width: 600px;
max-width: 800px;
height: 400px;
transform: translate(-50%);
}
Ya que necesitas moverlo también hacia arriba, usé
translate en lugar de usar sólo
translateX, te ahorras una linea.
siddartha23 es un elemento posicionado de forma absoluta, ahí no funcionan, ni deben, los márgenes automáticos.