be nice if this actually worked however, a valiant effort..

I've been looking for a fix for transparent background images for SO long! Finally something that works although I had to go to 'view source' on your demo as the code above doesn't work. I needed to have variable height on the element (not fixed as in the example) so I replaced DIV# with TD# and gave the id to my TD with 100% height. Worked a treat thanks!!!

There was a problem with some of the code not being escaped properly so it didn't show up right. I've fixed that and clarified the instructions, so it should be fine.

Thanks so much this is a life saver

I think that if you put a relative position on the elements they will become active again. Definitely test that first though because I haven't used this technique in a while

many thanks.

You know, I've read the same tutorial on png transparency on different websites, and this is the first one to actually explain it well. I am very happy to finally get this effect to work. Using repeat-y background image for my drop shadow effect was the only way to accomplish the layout for my client and this helped me a lot. Some people on this page are saying, "be nice if this actually worked however, a valiant effort..", well I say to them, read the tutorial and pay attention and you will get it to work too. Any clearer and you might as well ask to have it done for you on your own hosting server / personal website. Good job man.

This worked for me perfectly. Instead of the css condition though I used the underscore hack :

DIV#yourDiv {
width:600px;
height:400px;
background-image: url(images/yourImage.png);
background-repeat: repeat-y;
position:absolute;
top: 82px;
left: 46px;
padding-left: 25px;
_background-image: none;
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/yourImage.png,
sizingMethod='scale');
}

thanks again for this!

Danny

AWESOME! :)

Thank you so much.
Good work.

Ok folks, the alpha filter is the best. this can be applied directly or through css.

TO MAKE LINKS CLICKABLE (read carefully):
if you have a link or child div within a div using the MS alpha filter, it will be unclickable.
THE FIX: the parent div CANNOT have a position (ie: absolute, relative, etc) and the child div MUST have a position. So, just create another div around any divs using the MS alpha filter and use absolute positioning or whatever. there's a few ways to do it, but just pay attention to the first part. that will fix your link problem.

release with jQuery: http://www.drescher-hackel.de/default,date,2008-12-10.aspx

i cannot do this. :S not working in td.

Thanks!! Works great!

worked perfectly for me! Thanks a lot!

Thanks!!

Thanks you again!

IE6 worked it!

Supper..

Thanks for the help.

One thing to note which I discovered: file paths in filter declarations aren't relative to the stylesheet as they are in background-image declarations. I assume they're relative to the webpage. I just made mine absolute.

Thanks a lot :)

You have a very good share in web design thanks.

i hate IE and thanks for solving my problem.

Thanks a lot, this is the best tutorial about IE6 and alfafilter i ever saw. And you know the best ... it perfectly work ;) there is so much pngfix script who doesn't work on the web. This one is perfect.

Gold! you save my day ;)

really very nice css script , by this tutorial we can learn how can we fix png image transperancy in IE6 . thanks for this very useful great post.

++1

Transparent images are not yet a CSS standard, yet they are supported by most modern browsers. However, this is part of the W3C CSS3 recommendation. Implementation varies from one client to another, so you will have to use more than one syntax for cross-browser compatibility.

http://www.handycss.com/effects/transparent-image-in-css/