I was using very confidently unitpngfix hack for several months, today suddenly i got a bug that is creating this hack. I have simple div boxes to create buttons like | 1 | 2 | 3 | 4 | 5 | and every number has a round corner image in their wrapper div( first, second, third and so on…). That image is in its css background property.

I want to make transparent on all browsers so i used that unitpngfix hack. as i enable that hack then clickable area on all the numbers | 1 | 2 | 3 | 4 | 5 | doesn’t work on ie6 and ie7.

html code:

1
2
3
4
5

css code:

.banner_main_box1 {
margin: 0px;
padding: 0px;
position: absolute;
z-index:8;
left: 824px;
color: #000000;
width: 156px;
height: 30px;
top: 404px;
}
.banner_main_box1 .first {
margin: 0px;
padding: 5px 0 0 0px;
float: left;
position:absolute;
left: 0px;
background: transparent url(../images/banner-bullet.png) no-repeat 0 0;
width: 28px;
height: 27px;
top: -3px;
display: block;
}
.banner_main_box1 .second { margin: 0px; padding: 5px 0 0 0px; float: left; position:absolute; left: 32px; background: transparent url(../images/banner-bullet.png) no-repeat 0 0;width: 28px; height: 27px; top: -3px;}

.banner_main_box1 .third { margin: 0px; padding: 5px 0 0 0px; float: left; position:absolute; left: 64px; background: transparent url(../images/banner-bullet.png) no-repeat 0 0;width: 28px; height: 27px; top: -3px;}

.banner_main_box1 .fourth { margin: 0px; padding: 5px 0 0 0px; float: left; position:absolute; left: 95px; background: transparent url(../images/banner-bullet.png) no-repeat 0 0;width: 28px; height: 27px; top: -3px;}

.banner_main_box1 .five { margin: 0px; padding: 5px 0 0 0px; float: left; position:absolute; left: 128px; background: transparent url(../images/banner-bullet.png) no-repeat 0 0;width: 28px; height: 27px; top: -3px;}

.banner_main_box1 a { margin: 0px; padding: 0 0 0 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-decoration: none; }

.banner_main_box1 a:hover { color: #000000; text-decoration: none; }

help me if any of you have solution for this.
my email id is info@admecindia.co.in

Thanks in advanced
admec multimedia institute

For those who use the jQuery effect “Image Cross Fade Transition” posted on http://jqueryfordesigners.com/image-cross-fade-transition/ will find out that even though they’re using Unit Fix as the IE PNG solution, there is still an error with the transparency.

The initial PNG image is clearly fixed. There are no image transparency issues here. However, during the Mouse Over effect, the second PNG image is not fixed and shows the dreaded greyish/white background.

If you figure out a solution to this, I would absolutely love to hear about it because it would solve many of my problems. Thank you.

Though the scripts are better than nothing at times, don’t expect them to be a one size fits all fix.