"background-clip" not working?

Question

Was looking at this as I wanted to make my image into text. According to what it says, in other browsers, the text should be the colour you set it as and there'd be no background (unless I misread).

Anyhow, on Chrome, it seems to work perfectly as stated though on other browsers, the fallback of using Modernizr is not working. It adds the class of backgroundclip regardless. All browsers are returning true. Even on the Mozilla Developer Network it's saying that browsers support this even though this is not the case.

What Firefox and other browsers are doing is displaying the background. This is a problem for me as the image I'm using as text is practically all white with a slight pattern through it. So white on white with a slight pattern isn't exactly easy to see.

Things I've tried:

background-clip:text;
-moz-background-clip:text;

Neither of these two worked.

What I need is either a way to get background-clip working in other browsers (at least Firefox) OR to get it working as intended. Having the image as text in Chrome and plain colour for other browsers. Is there something I can do/use, to get this?

Answer 1

See https://github.com/Modernizr/Modernizr/issues/199 for background.

Basically, Modernizr was previously detecting background-clip by itself, which lead to issues like the one we have here. A standalone test for background-clip: text now exists, which you should be able to pluck out and use in the current pre 3.0 releases.