homepage Welcome to WebmasterWorld Guest from 54.204.249.184
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
IE6 image rendering problem
Aspect ratios: too wide or too tall on first load
CDNQuilter




msg:3123520
 12:36 am on Oct 17, 2006 (gmt 0)

I am a website development novice with an image rendering problem.

With IE6, the images on my site are displaying with incorrect aspect ratios when the pages are first loaded.

Some images are rendering too tall and others too wide. They appear to be rendering square.

When I navigate away from the page and come back to it, the images are rendered correctly - except for the largest page - which seems to require a couple more tries before all of the pictures are rendering correctly.

None of the images in question are in divs of restricted sizes. They are also being loaded at their actual sizes (except for a couple that are a couple of px different - not enough to make a difference).

I had the same problem in the page header and also had some of the header background div showing below the pictures. I found this message:

[webmasterworld.com...]

and when I fixed the margin problem by using display: block; for the header images, they rendered correctly also.

Do I have to use display: block; on ALL the images in order for them to render with the correct aspect ratios first try? Or is there some other fix.

Thanks in advance for all replies

jean

 

CDNQuilter




msg:3123571
 1:30 am on Oct 17, 2006 (gmt 0)

"and when I fixed the margin problem by using display: block; for the header images, they rendered correctly also."

no such luck. Although they are correct on my DD's IE6.0.2900, my header background image is still hanging below the pictures on browershots.org

I have just learned that I cannot post links to the site in question so I will post some sample code instead. Apologies for violating the forum rules by posting a link.

regards
jean

[edited by: CDNQuilter at 1:34 am (utc) on Oct. 17, 2006]

SuzyUK




msg:3124587
 8:18 pm on Oct 17, 2006 (gmt 0)

Jean,
when you say the images are being loaded at their actual sizes, have you got those explicit sizes specified somewhere in the HTML or CSS?

e.g.
<img src="my.gif"
width="100" height="100" alt="">
or
<img src="my.gif"
style="width: 100px; height: 100px;" alt="">

(Note: units are important in CSS)

penders




msg:3124697
 9:24 pm on Oct 17, 2006 (gmt 0)

Do I have to use display: block; on ALL the images in order for them to render with the correct aspect ratios first try?

No, you should not have to set display:block; in order to get your images displaying at the correct aspect ratio, but I think you've realised that already. That, I think, is an unrelated issue.

However, it is a very good idea to set the image dimensions explicitly, if you are not doing already, as Suzy suggests.

piskie




msg:3124746
 9:50 pm on Oct 17, 2006 (gmt 0)

Image width and height can be an issue with a bad or Wrong DTD.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved