Luego de de esta prolongada selección de datos pudimos solucionar esta traba que presentan algunos los usuarios. Te ofrecemos la respuesta y nuestro deseo es que te sea de mucha apoyo.
Solución:
Si especifica un tamaño del 100% para su imagen. Su imagen tomará entonces el 100% de su contenedor.
Lo que desea es mantener su archivo en su tamaño original, así que no especifique ningún tamaño para su imagen.
overflow:hidden es el key para mostrar sólo una parte de su imagen.
Si quieres tener siempre visible el centro de tu imagen, deberías echar un vistazo a esta propiedad CSS3 transform:translate(-50%,-50%) con un posicionamiento adecuado.
Echa un vistazo a este jsfiddle y dime si te puede ayudar.
Editar: con el navegador moderno 2020, puede ser útil echar un vistazo al CSS object-fit propiedad. En particular object-fit: cover;. Echa un vistazo a este jsfiddle actualizado.
Te mostramos comentarios y valoraciones
Si entiendes que te ha resultado de provecho este artículo, sería de mucha ayuda si lo compartes con más juniors y nos ayudes a difundir nuestro contenido.