Para centrar bloques de contenido, imágenes u otro elemento dentro de nuestro contenedor lo que debemos hacer es lo siguiente:

div {
  width: 400px;
  margin: auto;
}

Definimos el ancho del elemento, ya que si ocupara un 100% o este no fuese definido, no tendría efecto el aplicar margin:auto. Éste último estilo es el que realmente hace el trabajo, pues le indica al navegador que el espacio restante al que ocupa el elemento definido, sea divido en partes iguales y que sea aplicado a ambos lados del elemento.

Para el caso de imágenes responsive, a pesar de que su ancho es de 100%, el height será auto, por lo que la imagen será proporcional al tamaño del contenedor en el que se encuentra. En este aspecto podemos indicar un ancho fijo al contenedor y aplicar de igual forma a la imagen un margin:auto.

contenedor {
  width: 75%;
}

contenedor img {
  display: block;
  width: 100%;
  height: auto;
  margin: auto;
}

Dando como resultado una imagen centrada horizontalmente.

Y eso es todo, esperamos que esta información les sea de utilidad.