Hi,

I am working on an interesting task which is now turning into a headache.. any help greatly appreciated..

There are a few images on a website with height and width 500px each for the image container box and the images have various sizes less than 500px height and width. Now what I am trying to do is, get the images from the website and resize it to 200px height and width and display as 'background image' on container box on my HTML. I cannot do it manually as they are dynamic. I am able to achieve it on FF but I want it to work on all major browsers (IE 7,8,9, FF 3.6, 8.0, Chrome, Safari, Opera).

Below is the css that im using which is good for FF

.itemImage .imgDiv {
background-position: center canter;
background-repeat: no-repeat;
background-size: 200px auto;
width: 200px;
height: 200px;
}