Menu
this is my first attempt at a responsive design so excuse me if this is a stupid simple question.
I have created an image and set its max-width to no larger than the actually width of the image since I know that scaling up an image will result in blurry nastiness.
What I am a bit confused on is that as I contract the window and the img begins to shrink, it gets blurry as well...
Is this correct behavior and is there some way around this?
Any help appreciated!
375
With Photoshop, you can resize an image without losing quality by using the "Image Size" dialog box. In the "Image Size" dialog box, you can change the width and height of the image. You can also change the resolution. The resolution is the number of pixels per inch.
Most of the time, reducing an image's size or dimensions won't affect the image's quality. Making an image to be larger than its original dimensions can be tricky. Resizing an image larger than its original dimensions can affect the quality.
Open your image in Photoshop. Go to the Image Size dialog, check resample, and select "Preserve Details" in the corresponding dropdown menu. Make sure the Resolution is set to 300 Pixels/Inch. Set Width and Height to inches and adjust to enlarge your image.
If your using Fire Fox it has been reported to have problems scaling down images.
Why is Firefox so bad at resizing images?
Firefox blurs an image when scaled through external CSS or inline style.
Apparently adding the following to the CSS has fixed the problem for some
image-rendering: -moz-crisp-edges;
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
