RadioButton: appears jagged when ancestor node has shadow class (IE8)

[Wouter Hager]

The claro .dijitCheckBoxInput class for the dijit.form.RadioButton uses an opacity filter to hide the original html input field. It does not draw well (jagged) in IE8.

[bill]

It looks OK to me, maybe you have a better eye than me, or are you seeing something different than I am? Mine looks like:

There were a couple reasons for the opacity filter rather than just hiding the native <input type=radio>:

1. for the browser to catch clicks on the native radio button and automatically deselect other radio buttons (with the same name). But in the end we needed to do that operation in javascript anyway, I forget why.
2. easier to get screen readers etc. working, if focus went to an <img> node (or a <span>) with a background image rather than to a <input type=radio> then we need various aria-... roles and states assigned to it

[bill]

on my machine

[Wouter Hager]

The problem seems to appear only when I try to load the radiobutton from xhr (as text) and set it as the content of a contentpane. More stuff seems broken in IE when I do this. Is there some startup requirement perhaps?

[Wouter Hager]

I've discovered the cause. The radiobuttons inherited a shadow from a totally unrelated ancestor element. After all this time I'm just starting to discover the unfathomable intricacies of IE filters...

[bill]

OK, I guess this is a wontfix. Probably there's some CSS we can add for checkbox/radio button to override any inherited shadow effect, but not sure if it's worth it for such an unusual case. You could just add it locally.

[Wouter Hager]

I've already looked for a way to clear the filter on inherited elements in IE but no dice. A long & hard google search yielded several pointers but no working solutions. I have torn out the proprietary filters and hope my client won't notice...

[bill]

Ah OK, I hope so too :-). That's a weird that you can't override an ancestor's setting. Or for that matter, that an ancestor's setting trickles down to descendant nodes.

[Wouter Hager]

It's not weird it's IE ;) I couldn't find any consistency in the filter inheritance. For example, fonts don't get shadow unless the background is transparent (but they do change in shape). I don't have a lot of time to find out now. I wonder if anyone knows or has done some extensive testing. I'd like to stick to what I said: unfathomable. It would be valuable to put this up on the web somewhere.. perhaps for 9.