CSS, Max-Width and skinny images in Safari (on Mac)

[Stentorian]

Hello,

I am having trouble with skinny images in Safari on a Mac (This works fine in Safari beta for windows!)

Basically I have set up a CSS class using 'max-width' to ensure that images do not expand beyond 100px. I have included the hack for IE. Works fine on a PC in IE, Firefox, Opera and Safari. But in Safari on a Mac the width is confined, but the image does not scale, the height remains the actually height of the image and so I get skinny images and crap layout.

I need to use the max width, as users will be uploading any old photos (you know what users are like) and I need to keep it within the design. I also cannot use max height, as some photos are landscape and others portrait.

I search for a hack but couldn't find any...any ideas?

.content_image {                        
    max-width: 100px;
    float: left;    
    overflow: hidden;
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1px #175592 solid;
    width:expression(this.offsetWidth>99?100:'');
}
 

Thanks.
Ben

[drhowarddrfine]

I really need to get a Mac.

max-width, et al, works on Safari. Perhaps you can do:
.content_image img{ max-width:100px} and see what happens?

[Stentorian]

Thanks Dr.

Yes I know what you mean. Having a mac would be useful, but can't really bring myself to spend £1000 just for testing one browser!

I will try the 'img' definition and see what happens...

Cheers.
Ben