Browser renders high resolution images to very low resolution?

See more:

browser

resolution

Is there any css property that help in fixing how chrome handles the image?

I designed a logo for my website in adobe illustrator and when i uploaded to my website. it loads nicely on IE but very low resolution on chrome. the more i increase the dimension of the image on adobe illustrator (and re-scale it with css) the more the image becomes low resolution, blurry and details not clear.

otherwise, chrome on phone and other web browsers work fine.

https://drive.google.com/open?id=0BwjYDGIA089Td2xBdDE0b0h4ems

Thank you !

What I have tried:

tried to upload it as SVG but didn't work, as u can see in the linked picture, still the circle pixelated. I did try to save it from illustrator to Photoshop then upload it.

The image is very good on phone with high resolution but bad with low resolution.