PNGs, DIVs and IE6

[noiseordinance]

Hi there. I'm not sure if this question is more suited for a CSS subforum, or a graphics subforum? I'm doing a website with tons of PNG images. All of my images have absolute positioning within DIVs. Some of the images serve as a DIV background, allowing me to create layers. Others are just imgs within a DIV for buttons, etc. At any rate, I've been looking at the many fixes for PNG support on IE6. There's a couple that you just load a .js file and it's supposed to fix all PNGs, but as you guys probably already know, it gives me child-link errors because of my images within DIVs. Then there are in-line alpha filter tags I can place before images but that doesn't seem to work for PNGs I want to use as buttons.

I'm trying to figure out what I can do, and what I'm doing wrong...

[tonynoriega]

why dont you use .gif's?

the transparency isnt as clean, but thats only if you are using gradients or drop shadows...

i try to avoid hacking html for graphics when there are alternate methods.

2 cents.

[noiseordinance]

I have always used gifs but the designer has made the site really really shadow / transparency / gradient heavy and claims that most of the images looked awful when created as a gif. Am I screwed here?

[tonynoriega]

if the .js or other hacks dont work.... try a .jpg...

do the buttons really need transparency?

[noiseordinance]

Yeah, the buttons need transparency. The reason why is because the site is basically a big image with buttons absolutely positioned over the picture. I'm used to using tables so I've always been used to saying "yes, I can do that, just splice it up and send it to me." But I haven't done a site in years, and I'm trying to do my first one without tables, but it also happens to be my first site with png. Definitely getting the double whammy. I think I screwed the pooch here...

[tonynoriega]

well.. you can either drop the shadow on the graphics... or work on implementing the hack for the .png... (pretty obvious)...

why dont you take the main image... the background... slice that with the buttons on top with the drop shadow... and then do your mouseover effect...

basically use the main image and your buttons as one big image to put in the DIV.... that way you can use a jpg or gif if necessary... and dont need the transparency.