Streaming live at 10am (PST)

Clipping background image to text breaks on mobile

I found this code to clip a background image to some text:

.clipped {
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;

But when I use it on the line “This era will be won by those with the courage to shape it:” it breaks on mobile. See image:

When I view the mobile preview in Webflow, it does not show this. It’s only when I view it on my iphone does it do this. It works fine on desktop.

Any ideas on how I can fix this? Or another way to achieve this effect?

Thanks!


Here is my site Read-Only: link

I have since removed the code so that the live site performs as wanted. But would still love to solve the issue so that I can use that design style.