IE7 IE8 IE9 color:transparent property

Question

I may not have enough information to generate a complete question here but I am going to give it a shot if anyone has ideas or needs more info ask in comments and i will try to get as much information as I can.

I am dealing with an issue in some code that I did not write. The page uses a javascript date picker and puts that date into an input box. Tracing through the code and hitting f12 I changed the property from

    style="color:transparent"

to

    style="color:black"

and i am able to see the date that is entered into the input field.

The transparent text only occurs in IE9 though, and show correctly in IE7 and IE8. So I have a solution to the problem but my question is if anyone has run across this issue before what is causing this. If the differences between IE version are to blame is there a way with a stylesheet to make it work correctly across all versions, because changing the source code is dangerous at best I am trying to find a way to make changes to this wihout changing the page.

Thank You for any comments or suggestions.

Answer 1

The cause is that IE7 and IE8 apparently don't support color: transparent and IE9 does. As far as I can tell, IE9 is the one that is acting correctly and IE7 and IE8 are wrong, not the other way around.

To me the "best" fix is to change the source. I'm not really sure how you want to fix anything "without changing the page", you have to change something.

If you really won't change the source of the datepicker you could use !important as a last resort.

<some selector>{
    color: black !important;
}