Question

Is there any CSS hack to target just browsers that do not support the text-shadow CSS property?

It is a very important visibility/readability/accessibility problem, since something like having light gray text with a dark shadow on a white bg may become unreadable if the dark text shadow is not visible. And the designer insists on using this, and not using text image replacements. (I could try and target recent browsers, but I had the surprise of even IE9 not understanding text-shadow, and god only knows what the support for this is on all the mobile devices out there…)

Answer 1

You have to use this script:

if (document.createElement('div').style.textShadow !== '') {
    document.documentElement.className += ' no-textshadow';
}

Then you can do:

.no-textshadow h1 {
    background: #fff;
    color: #000;
}