1 (edited by cuteseal 2006-01-16 22:58)

Topic: Image resizing

Hi all,

I finally upgraded to punbb 1.2.10 (from 1.1.5) a couple of days back (yeah, procrastinating to the max again), and love the new look and functionality.

Just a query regarding the CSS used to resize images - I think this is in styles/imports/base.css :

I think {max-width: 100%} CSS is being specified on images, so that large images fit automatically and don't go larger than the width of the page... in firefox, it works perfectly. But in IE, it has the unfortunate effect of resizing images smaller than the width of the page, to the full width of the page.  The resulting image is large, ugly and pixelly...

The image only appears like that when you first load the page.  If you resize the window, or reload the page, the image snaps back to its original size.

See an example here:
http://shuttertalk.com/forums/viewtopic.php?id=4639
Using IE, you'll see a large, pixellly "R".. but if you resize the window or reload the page, it goes back to its original size.

Is this a known issue?


Thanks,
Jules

Digital photography news, reviews, discussions and more!
http://www.shuttertalk.com

The online bible for all
http://www.publicbible.com

2

Re: Image resizing

IE doesn't actually do max-width so there is a javascript file which mimics max-width functionality. Can you see the same problem on this forum?

If there are any javascript gurus looking at this perhaps they could take a look at minmax.js and see if there are timing issues or if there is some way of making it more responsive.

3 (edited by cuteseal 2006-01-17 00:30)

Re: Image resizing

Hi Paul,

Thanks for your input...

Funny, I did a test post here, but it doesn't seem to be exhibiting the buggy behaviour. Strange.

I see it happening on this page though, which was what led me to believe it was to do with the max-width:
http://www.clagnut.com/sandbox/imagetest3/
Look at example 4 (with IE)...

I checked to see whether the minmax.js script is being called on my site, and it looks like it is.


Any ideas what's going wrong people?


TIA,
Jules

Digital photography news, reviews, discussions and more!
http://www.shuttertalk.com

The online bible for all
http://www.publicbible.com

Re: Image resizing

Try the following:


/* fix image size in IE */
IMG.postimg {width: expression(this.width > 400 ? 400: true);}
/* used to hide from IE, working in other browsers*/
IMG[class=postimg] {max-width: 100%}