Site Doesnt Work In Ie

[thejerm]

I have been recieving a few emails from readers of mine saying my site doesnt look right. http://www.thejerm.org I pretty much only use firefox these days a figured out that was the problem. IE renders my page differently (wrong I may add, thats why I like firefox but i cant force my reads to use it *sigh*).... could anyone give me a heads up on how to fix this problem?

[TCH-Don]

I see the the banner H1 and H2 overlaping

try adding some padding as a start.

 

#banner h1 {

font-size: xx-large;

padding-bottom: 10px;

}

#banner h2 {

font-size: small;

padding-top: 5px;

}

[owatagal]

Also, on the red-X for image problem, IE doesn't support PNG files. Transparent .gifs or .jpgs with the right color background would fix those problems.

 

The extra white space under the heading is a probably from one of many known white-space bugs in IE. Since everything is within the container div, you could try floating stuff to see if that closes up the white space -- float the banner; if that doesn't work, float the nav. I didn't look at the CSS, but assuming they both take up 100% of the container width, that should close up the vertical white space.

 

The extra white space to the left and right of everything probably has to do with IE's box model problem--they figure out width differently than everyone else. If you search google for "box model hack", you should get some quick fixes you can put in your CSS to take care of that.

 

I agree, it sucks designing for IE. One day, people will stop using it. Ha. One day, I'll have a job, too. Actually, overall, I think the design looks decent in IE--at least it's still readable!

[thejerm]

Thanks guys for your help

[D.Slatk]

Also, on the red-X for image problem, IE doesn't support PNG files. Transparent .gifs or .jpgs with the right color background would fix those problems.

<{POST_SNAPBACK}>

Heh...PNG files work in internet explorer. It has worked for quite a while actually, the old computers at my school, which have a very old version of IE all support my png sites. However, the alpha transparency does not work for IE unless in one of the newer versions they added it. However, full transparified (!) pixels in the image should work.

 

For people who don't know, alpha transparency is where you can have pixels semi-transparent. Like a red pixel have 25% transparency.

 

I'm probably a little bit off though. But I know they work in IE...

[stevevan]

Just as a slight difference, I noticed that when viewed in IE, you have a "shadow" on the left side. Firefox doesn't show that shadow.

[thejerm]

Yea i noticed the shadow as well.. My biggest annoyance is the font size in IE. It is HUGE compared to firefox.

[cak]

My biggest annoyance is the font size in IE.  It is HUGE compared to firefox.

The XML declaration at the top of your page causes Internet Explorer 6 to render in 'quirks (backward compatible) mode," so keyword sized fonts are going to appear one size larger than they would in "strict mode." This is arguably a bug in Internet Explorer 6; modern, standards compliant browsers (like FireFox) will render your XHTML pages in "strict mode."

*ttp://css-discuss.incutio.com/?page=UsingKeywords

*ttp://css-discuss.incutio.com/?page=RenderingMode

 

The XML declaration is technically optional in XHTML documents, but including it is definitely best practice if you are using a character encoding other than UTF-8.

*ttp://www.w3.org/TR/xhtml1/#guidelines

 

Noticed that you have specified an application/xhtml+xml content-type via a meta tag. Browsers are going to ignore that directive because the server is sending text/html. You will need a fairly sophisticated content negotiation script to serve application/xhtml+xml to user agents that claim to prefer it, and text/html to legacy browsers. Internet Explorer (among others) will not display documents sent with application/xhtml+xml content type.

*ttp://keystonewebsites.com/articles/mime_type.php

*ttp://www.autisticcuckoo.net/archive.php?id=2004/11/03/content-negotiation

 

HTH,

Carol

Edited March 17, 2005 by cak

[thejerm]

yay it is fixed. Thanks cak so much for your help. That did the trick. Now let us all pray (even if you are not religous do it this time) that IE7 will be standard compliant and work correctly.

[TCH-Don]

Looks good,

Way to go Carol

[Joaquin]

As far as the image placeholder (red X). When I do a right click and 'properties' on it I get the following for the URL of the image:

 

http://www.thejerm.org/iconss/.png

 

seems to me it's pointing to ".png" and not a real file. Maybe I'm wrong though.