-moz-background-clip:text does not work in Firefox

Question

I\'m trying to fill in the content of a text in a h1 tag by an image. Following my understanding ;-), I\'m doing the following in the html:

Answer 1

Whilst -webkit-background-clip:text exists, -moz-background-clip:text does not, so you won’t be able to achieve your clipping effect in Firefox. (Unless there’s another way I can’t think of.)

Neither does -moz-text-fill-color, although you could just use color:transparent, as long as the element doesn’t have anything else (e.g. borders, -wekbit-text-stroke) that you want to be visible.

Your code does work in Chrome and Safari:

• http://jsfiddle.net/7T8am/2/

However, the

’s text does need to be transparent, so if any other CSS code is setting a colour for the

, you’ll need to override it.