CODEWITHSUNDEEP
htmlcss
genxgeek
genxgeek

Reputation: 13357

Image scaling IE vs. Chrome

I have a 32bit, 96x96 transparent .png image that I am displaying in a page with a height of 24px to fit it in my header. In Chrome this displays very nicely (clean edges and resolved), however, in IE9 it is completely distorted.

Do I need to bump the image size from 96x96 to get it to display correctly in IE?

Upvotes: 2

Views: 1707

Answers (3)

Ben D
Ben D

Reputation: 14479

This is a default setting in ie9 (and I think ie7 and 8), but it actually has has a css solution:

img {
  -ms-interpolation-mode: bicubic;
}

Otherwise it will default to using the "Nearest Neighbor" algorythm to downsample images.

Upvotes: 5

Emil
Emil

Reputation: 8527

You should make sure that the size of the image is equal to the size of the container. You do not need to rely on browsers for re-sizing. In addition to rendering, there are performance issues with re-sizing.

Upvotes: 1

Ry-
Ry-

Reputation: 224913

Unfortunately, you probably will need to resize it. The way the browser decides to scale images isn't under your control, I don't think.

Upvotes: 1

Related Questions