html - Resize an image to take up all of a -

html - Resize an image to take up all of a <div> -

how can constrain image in container whole container filled much image possible?

for illustration (i not know size images be, example) - if have image container of 100x100 , image of 600x400, next conditions need met.

the image should displayed @ 150x100 the image should centred in container the overflow of image (25px left , right in example) should hidden.

please note - images of greater height width, solution needs work images of sizes, centreing both horizontally , vertically.

sadly, solution has work ie9 (as browser owners of intranet working on use), html5/css3 solutions not work.

here couple of visual examples -

i've tried various css styles -

if nest <img> within of <div> container image if absolutly place <img> on <div> unable centre vertically if wider tall (i.e. 600x400).

any suggestions gratefully received.

since mentioned has work ie9: background-size: cover that. can't utilize image img element have assign background image container.

i made jsfiddle here

html css