CSS question

[mikebrad]

I have a database of remotely hosted images for this non-poker affiliate website. The images are of each product and it seems that there is no system for the sizes of these images.

I need a way to fit each of these images into a box, 250 X 250, without skewing the image and not allowing the image to go outside of this box.

I've tried max-height & max-width but those don't seem to be supported by IE. Any other thoughts?

Possibly overflow?

[CAZ]

Is this YOUR data base, I.E do you have access to manipulate those images?

Couldntt you just do a batch resize all those images to 250x250 preserving the aspect?

[mikebrad]

No, I wish I could do that. I have an eCommerce type of site that has a bunch of products that I sell myself but I want to incorporate some affiliate datafeeds from cj into the picture and the images are hosted remotely. The image data field is nothing more than a url pointing to that image.

max-height works perfectly in Netscape but is screwy in others. This is the first time that I've ever come across this situation. The way I have it now, the images look good about 90% of the time.

[GregK]

IE doesn't support any max- or min- properties, height, width, nuthin'

Your best bet is to set either the width OR height of the images at 250px, not both though. Simply don't set anything for one or the other & it should scale to the other, preserving the aspect ratio so its not distorted.

Another option would be to use PHP & utilize PHP's built-in GD library or PHP/ASP/PERL & ImageMagik to alter the images. You can do most things Photoshop can do server-side if you know what you're doing? Resize, crop, create auto-thumbnails etc.
http://www.imagemagick.org/
Its really sweet but takes some work. If your site is PHP? I'd use the GD2 library.

Good luck.

[mikebrad]

GregK to the rescue again.

For now, I have the image width set to 225 because most of the images are wider, not taller. They do scale down but it just doesn't look as good as I'd like, especially since some of the images are only 150px wide (it blows those up and make them look distorted).

The site is PHP. I will look into GD2. Thanks a bunch!

[GregK]

ooh, those 150px images will cause problems any larger than 150px.

Could you set them all to 150px width?

Even GD etc. can't enlarge images without degrading the quality.

[mikebrad]

you know what would work perfectly?

MAX-WIDTH!!!

one day, IE will catch up with firefox.