I think there is still some issues when using a Css drop down menu. Absolute position doesn’t appear to be working.
It's been a while since last PNG fix for IE6 got out and as I've written back then it's not quite perfect and a bit buggy with the rest of JavaScript but now here's another one from Unit Interactive Labs, very fresh and promising, one of the first products of this company.
Also the second product so far from Unit Interactive Labs is a simple and useful tool tip rollover (named as UniTip) which also uses their PNG fix and it is very popular and used a lot these days over the web. Nice work Unit Interactive!
In their words this new png fix is inspired by work of 24ways.org, and here are some key features why you would use it. As far as I've tested it so far it's working fine.
So as you see progress has been made, talking about background-image and auto height elements. To include it use standard procedure, download JavaScript (you can do it directly here) and put it between <!--[if lt IE 7]> and <![endif]--> in head tag. And there's a new thing, a small image "clear.gif" which in their words "keep certain elements structurally sound when using the filter property" so you'll need to change path in the JS afterwords .
Another project worth a mentiong and also using their PNG fix is UniTip. This is now based on Craig Erskine’s qTip, It supports all browsers, is easy to deploy, and is surprisingly light-weight. Best of all: it offers you the opportunity to customize it to work well with any of your projects.
Installation is also simple, after a download include JavaScript and style in your head tag. For more information visit UniTip page.
Have some feedback? Leave a commentI think there is still some issues when using a Css drop down menu. Absolute position doesn’t appear to be working.
I’ve just posted a great png fix tool on my bog (simonhellin.be) it’s very easy to use and it uses javascript. When you add an that a png you just do and it works! it also works for background-image in css!
I just have to add that Twinhelix v 2.0 Alpha PNG fix is much better than this one, and with additional .js it supports background position and repeat. It’s awesome.
Carlo,
well you know, it would be about time to retire it (IE is abou6 7 years old right?) but yesterday i was at my friends and he is still using ie6 as well as old FF on both of computers so people (average internet users) just don’t know, and probably most of them don’t care about developers
I personally don’t care about it as i used to. I just use css reset and after that it comes to one or two lines of hacks for it
What’s about retiring IE6 from the scene (visit savethedevelopers.org )? If you want to see a brand new ‘Blue ray recorded movie’… you need the right player. So it should be for brand new “css3 / html5″ websites… you can see / read content with “old” browsers but can’t “enjoy” the “special effects”!
But you can get for free the right player (IE7, FF, Opera, Safari… ) so no excuse anymore.
hvala ![]()
png i ie6 me izludjuju
moze i srpski naravno
evo kopiracu ti ceo jedan kod sto ja koristim u jednom sajtu.
#header .featured{
width:555px;
background:url(images/black.png) left top repeat;
}
* html #header .featured {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’images/black.png’, sizingMethod=’scale’);
}
* html #header .featured *{
position:relative;
}
I ovo kod mene savrseno dobro radi, reci mi samo ako ti treba objasnjenje koda
yeah but for example lets say you have to use background-position: bottom; .. etc ? could it work that way with AlphaImageLoader filter? or it just have to be div with fixed width and fixed image size i how do you make re sizable boxes with background png images in IE6?
moze i na srpskom ako ti je lakse
for bg’s i don’t use regular and then just apply positon relative for IE6
* html #header {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’black.png’, sizingMethod=’scale’);
}
hm does this one works with background positioned pngs ? twinhelix didnt work for me since pngs went out kinda distorted and not in position as set in main css file…
Rob,
use position:relative for your container and that should fix it
Figured one issue out! using: img { display:block; }
has made the images reappear, w00p!
One issue I’ve come across on this pngfix is that using the images for links causes all sorts of problems in IE6. I’ve set a few images with links, some display and some disappear!!? I’m slightly confused as to why! Another thing is that I currently have a footer div with no css styles on it with text and an image inside. The whole div is not displaying?? When I remove the javascript its all back to normal… Anyone got any ideas???
I have a whole post on “using transparent PNGs on IE5″:
http://www.dozarte.com/wordpress/2007/12/01/usare-png-trasparenti-su-ie6/
…but it’s in Italian!
Also, regarding Twin Helix, a recent alpha of their iepngfix (17 July 2008) resolves the issue of positioned background images not working usually associated with most classic IE PNG fixes.
At first I thought enabling the png fix on certain elements was cool (in twinhelix), but it just gets annoying to troubleshoot after a while (htaccess problems, several different files, etc..).
This is a chill, one stop shop for ie6 png fixing. Thanks for the link!
This is far most the best pngfix i ever used. But it’s not perfect yet though… sigh IE6.
are you guys serious? twin helix has been around for years and has always supported bg images. it also uses blank.gif which is nothing new. http://www.twinhelix.com/css/iepngfix/
I didn’t know ![]()
Thanks
Awesome… been looking for a solution that works with BG images as well. Thanks for your work!
i know
heh yes you are right Dejan, it’s been quite a while since last png fix was out!
wee, something finaly that works with backgrounds!
on October 3, 2009
Thanks! I tried a bunch of fixes that didn’t work for my situation. This was easy to implement AND made my png’s attractive for CSS backgrounds with hover. Thanks for the help in making websites look great in multiple browsers!!!