On IE8,the images (arrow*.png and icon) in front of each tree item can show transparent but on IE6 they cannot.
The problem cause by IE6 PNG transparent problem.
I have googled and found 2 ways may solve this problem.
Change arrow*.png from 24bit to 8bit (arrow*.png is black. 24bit or 8bit make no difference), but this solution should not do for other *.png (icon). Because It’s too much work and make icon beauty reduced.
Use com.vaadin.terminal.gwt.client.Util.addPngFix() ,but I don’t know how to use it.
Anyone has easier work around. Please share with me.
The arrow image is as a background images for an element with v-treetable-node-closed stylename. So it should be quite easy to overcome the issue in your theme. Something like this should do it (not tested):
The 24bit versus 8 bit actually makes difference when you have a stronger background color like on selected rows. There one can’t have smooth edges without real transparency (except if you make an image for each background color).
To get a better fallback solution for IE6 to the next release, please fill a ticket to dev.vaadin.com. Otherwise I can promise that I will forget this issue
.v-ie6 .v-treetable-node-closed {
background: url(img/treetable/arrow-right.gif) right center no-repeat;
}
.v-ie6 .v-treetable-node-open {
background: url(img/treetable/arrow-down.gif) right center no-repeat;
}
I convert arrow*.png to arrow*.gif and use some code of treetable.css from TreeTable add-on.
I will very grateful, if in the future you will test this add-on with IE6 before release.
My customers still use IE6 and they have a lot of old web applications that comply with IE6.
They cannot change to newer browser.