PNG-八 format image opacity problem in IE8 & IE7

PNG-8 format image opacity problem in IE8 & IE7/*by garcon1986*/I use jquery ui library for display

PNG-8 format image opacity problem in IE8 & IE7

/*by garcon1986*/


I use jquery ui library for displaying several tabs with correspondant contents in my project. 


It works perfectly in Firefox and Chrome. When I click a tab different from current tab, it will show the content with new tab clicked.


Here is the correct display for my tabs:

PNG-八 format image opacity problem in IE8 & IE7



Its css is like this:




Just like what you've seen, the border becomes black, which cause my page disgracefully.


The reason is IE doesn't interprete the opacity of png-8 format image correctly. 


For this reason you can use the recommandation solutions of Jack Moore.


Or just change your image format from png-8 to png-24 like me, because IE works with png-24.


Hope this helps! 


Enjoy coding!