Blurred images in chrome

Discussion in 'Web Design and Development' started by Tavicu, Dec 22, 2014.

  1. Tavicu macrumors regular


    Jul 25, 2013

    I'm having a problem and i can't find a fix.

    I have an image in container with width: 100%.

    Even if the image is bigger than the container the image is still blurry in Chrome.

    In Safari i fixed it with "image-rendering: -webkit-optimize-contrast;" but i can't find a fix for Chrome.

    Here you can see the problem (look at MacBook Air text):

    The image is 1147px width and the container is 1140px (so the image is resized with css from 1147 to 1140).

    If i remove the width:100% and height: auto from css it will looks ok and crisp like original image (but without responsive).

    Anyone had this problem before?
  2. DevinPitcher macrumors regular

    May 23, 2009
    Michigan, USA, Earth
    Why not crop off the extra 7 pixels so the browser doesn't have to size it down at all? Fixes your blurring problem for all browsers.

Share This Page