[Resolved] Is it possible to add brush stroke link CSS?

[Mark]

I have tried to set this up but I am struggling, is this something you can help implement. I like how the links are highlighted throughout the site. I would like to implement this myself if at all possible.Brit.co I have a PNG brush stroke file uploaded to my media.

[Tom]

Hi there,

They’re using this method:

.entry-content a {
    background-image: linear-gradient(180deg,#fff06b,#fff06b);
    background-repeat: no-repeat;
    background-position: 4px bottom;
    background-size: 100% 10px;
    text-decoration: none;
}

Should just need to change the colors.

Let me know 🙂

[Mark]

That’s exactly what I was looking for is there a way to change the text from green to black. I have changed in the settings and preview shows it as fully black with no yellow behind it at all. Sorry if this is a pain.

[Leo]

What text are you referring to?

Can you guide us to the page where the issue can be seen?

[Mark]

That would probably help. So, I have applied that CSS to my site. This has worked and is now active on the site. The text inside yellow linear-gradient css is green. I went to the body settings and attempted to change the colour link text back to black but when I do this it removes the CSS styling and the linear-gradient appears to vanish/remove itself.

[Tom]

I wonder if that’s just the live preview not knowing the gradient CSS is there. What happens if you change the color and then visit another page with a link in the Customizer? That will cause the frame to reload.

You can also just save the black value and check the live site.

Let me know 🙂

[Mark]

Thank you buddy, spot on advice and guidance as always. Worked a treat.

[Tom]

Glad I could help 🙂

[Author]

Posts