CSS: centre and crop an image with a fixed height

css-centre-crop-image.css

/* Centre and crop an image with a fixed height */
.crop {
	position: relative;  /* provide a positioning context */
	overflow: hidden;
	height: 200px;       /* make space */
}
.crop img {
	position: absolute;
	left: -100%;         /* anchor the image corners outside the viewable area (increase for large images) */
	right: -100%;
	top: -100%;
	bottom: -100%;
	width: auto;         /* dynamic width based on viewable area */
	height: 200px;       /* set height (swap these for variable height) */
	margin: auto;        /* centre the image */
}