I was talking to Mel the other day about the new design of her site, . I like it, it’s a fresh departure from what she had previously. I think she might want to offer different colour schemes though, easily achieved via some css and alternative stylesheets. During the course of our conversation we discussed the middle image and I asked, without thinking, was she using background-image?

Simply put - a user can change their browser settings to automatically resize images. This is unfair to the designer who might want a particular image to be a specific size, it might be part of the design for example. So the easy way to resolve this is to create a div with specific size (height and width), giving it the image you want it to have via background-image. Voila - it can’t be resized by the browser.

The disadvantage to this method is that you can’t make the image a link.

Other methods I have found, elegant or otherwise: snook.ca has a Prevent Image Resize in MSHTML/DEC, FireFox Extension Guru’s Blog has a post Stop Automatic Image Resizing, the old standby IE has a post to stop it at Microsoft TechNet (just showing how to do it in IE).

Again - note that my method is specific for keeping large images large, and not letting users have their browser resize it via browser controls.