-2

When I use a linear-gradient on an image it shows a bunch of lines that are going across the screen as it fades to the bottom.

gradient clipping lines picture

I've tried looking this up and saw that the height shouldn't be 100% but when I changed it to what the person said it didn't change anything.

-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(11, 11, 11, 0))); mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(11, 11, 11,0));

This is the gradient I'm using

Noah
  • 3
  • 1
  • The question is unclear. What lines? What do you want to achieve? Can you give us also the HTML example, so we can test directly on the problem? Did you test it on another browser? – Marin HTML Jan 12 '23 at 07:25
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Jan 12 '23 at 10:45

1 Answers1

0

Hope I have this right in what you want. You can add a gradient background by adding a background-image:

background-image:linear-gradient (#520c52d9, 
#00000050);
background-repeat: no-repeat;
background-size: contain;
// Or it could be
background-size: cover;
// OR
background-size: 100%;

There is much more you can do with this and I don't mind helping. Just let me know I do this a good amount. You can even put this on the text by making the Text Transparent (a bit of a jimmy rig like)