I'd like to resize and crop an image of unknown dimensions, just with css. The image should be resized/cropped to completely fill a container of known dimensions, cutting off as little of the image as possible.

Also, if an image is cropped then I'd like to determine, for example, that the center of the image should be shown, not the top left. 

I made a jsfiddle illustrating the issue: <http://jsfiddle.net/q9jFx/>

I can, for example, set image width to 100%, but that doesn't work if the image is wider than it is tall.

```
.container { width: 180px; height: 160px; overflow: hidden; border:red solid 2px }
.container img { width:100%}

<div class="container">
     <img src="the_src" alt="alt" />
</div>

```