IE conditional comments ?

[Sea Dragon]

This site looks good in Firefox but none of my images show in IE, in fact it just sits there trying to load until I finally just close it. All of my images are .png. Should I write a CSS for IE and save all images as .gifs or .jpgs to get it to render right? Then, I'm not sure on the IE CSS - do I have to incorporate the whole main css, or just write it to show the different format of images?

Here's the link -(spaces added) stephen wesley agency.com/client_preview_area/Rapid%20Environmental/ index.html (only loaded the home page)

 

So, something like this in the head-

 

where I then have just my different format of images with the same image rules as the main css? Do I have to add the css image rules? Or will it pick it up from the main?

 

Am I on the right track:/

 

Or should I do something entirely different for frickin' IE?

 

tia

Edited January 12, 2009 by Sea Dragon

[LSW]

IE is Buggy with PNGs, are they using transparency? We talking IE 6?

[Sea Dragon]

Yes, transparencies and yes, IE 6. I'll probably have to make one for IE7 too, huh?

[LSW]

Hang tight, one of the regulars has done it often. There are IE work arounds and he knows them. Just forgot who it is right off hand. IE7 supports transparent PNGs better and IE 8 should be full support I think.

 

Or pop over to the old forum and do a search for PNG transparencies. He had a few threads talking about it there.

[Sea Dragon]

Thank you. Sometimes I just need the 'right' search terms!

I was over there looking for 'IE conditional comments'. Looks like FalkenCreative and Im have some good links over there for handling png transparencies. Going back now.....

[LSW]

Should have guessed it was lm LOL

[Sea Dragon]

OK, looks like I will be writing an extra style sheet for IE6 and possibly IE7. I also read that I don't need to write all the styles from my main css for each IE css. I need only write the required fixes and then in the

link first to my main.css, then to the IE6.css. There is also some code for writing one that includes all versions. These style sheets will mainly deal with my bkg, header and footer .png images.

But the images that I have within my body content that are different on each page, I have changed to .jpg at this point. I'm not sure, but if I wanted to leave them as .png (maybe because of transparency or something) would I write a conditional comment directly in the html? And would it look like this?

 

[Wickham]

You can write conditional comments directly into the markup, but it isn't often done and I'm not sure if experts approve. (It's done for dropdown menus where IE6 has to have a small table inserted but other browsers don't need it.)

 

However, your code would apply two images in IE6; (one wouldn't work but it would leave a space) so you have to insert several conditional comments, one for IE greater than IE6, one for NOT IE (other browsers) and then one for IE6, something like this although I haven't tested it:-

 

 

Note the space between ie and 6. lte means less than or equal, gte means greater than or equal.

 

The not ie code can be nested inside the if gte ie code as an alternative.

 

See http://w ww.javascriptkit.com/howto/cc2.shtml

 

where the nested ........ is NOT IE. Note the different start and ending.

Edited January 13, 2009 by Wickham