Comments on: Hacking transparent PNG support into IE6 with IE PNG Fix, CSS and jQuery (part 2 of 2)

By: Philip

Philip — Mon, 13 Oct 2008 15:13:01 +0000

great article! But honestly, after writing work around’s for IEs for years I’m starting to slack… as long as functionality doesn’t falter I try to avoid writing ie6 only fixes. hopefully it’ll die soon.

By: temiyemi

temiyemi — Sat, 07 Jun 2008 21:23:34 +0000

i tried this out on a site that had similar problems… it fixed the transparency issue quite as expected… but it also created a new problem: it disabled mapping on one of the images used for links in the site.

have u any solution to that?

By: Ryan Fitzer

Ryan Fitzer — Wed, 16 Apr 2008 04:38:32 +0000

Thanks for sharing.

Little by little I've started to lose my obsession for keeping modern designs intact in IE 6, but sometimes clients just refuse to relax about it. One trick I've used in the past for rounded corners was to serve IE 6 aliased .gifs.

Basically, create a rounded cornered .gif and delete any pixel that needs any percentage of transparency. The rounded corners are a little prickly but so is the default text rendering on IE 6 (even ClearType looks pretty squarish). The corners are probably not noticeable to a good percentage of IE 6 users as I'm guessing they are used to a substandard visual experience anyway.

By: Jeff Howden

Jeff Howden — Fri, 11 Apr 2008 08:22:09 +0000

Use conditional comments to serve some IE6-specific CSS. In this IE6 specific CSS, simply send some GIFs down the wire in place of PNGs. Granted the GIFs won’t look as nice as the PNG solution, but they’ll look better than the unfixed PNGs for IE6 users with scripting disabled.

By: Shelley

Shelley — Thu, 10 Apr 2008 19:17:46 +0000

My knee tends to jerk whenever I see script creating static web design elements. Have you thought of using SVG, like *in this page (scroll down for comments)? Safari, Firefox, and Opera all see the curved capstones around the comments, while IE doesn't see the capstones (neither is there space taken up by the capstones in IE).

I even have the page setup to sample the header graphic to generate the gradient color using server side technology that updates the CSS setting. The point is, though, there's very little SVG needed for this example, and the effect degrades cleanly for IE, which can't see any of the SVG.

*Since you strip out URLs:

http://realtech.burningbird.net/design/off-painting/

By: Tolga Besiktasli

Tolga Besiktasli — Wed, 09 Apr 2008 15:59:32 +0000

Thanks for this solution. However, what would be your suggestion in case i one has a png background shadow image around the whole site?

1. i got one div holding a top left png shadow -> no problem
2. i got one div holding a top right png shadow -> problem
3. i got one div containing two other divs. one for bottom left corner and one for bottom right corner... -> problem

would you suggest the same way? taking foreground images and positioning them as needed? or can i hack the positions in the turnbull solution already? (as mentioned in the article..)

thanks in advance