IE10: 'visibility:visible' on before pseudo-element of 'visibility:hidden' element

Question

I have made a DIV with visibility: hidden and attached a ::before pseudo-element of this DIV with visibility: visible. This works as expected in Firefox, Chrome and Safari, but in Internet Explorer 10 the pseudo-element does not render.

Please explain if I'm accomplishing this wrong, or whether this is an issue with Internet Explorer. Are there any work arounds (we only have access to the CSS, not the source HTML)?

JSFiddle demonstrating issue.

Answer 1

Filters don't work on pseudo elements in IE.
Read: msdn

Other specified styling properties apply to the appearance of the inserted content, not to the element's content.

IE sucks, deal with it.
I think the only way is to change the "hidden text" color to your background color, and you know the rest...