Blur just on text links NOT on linked images

[MaxWinter]

Re: Blurry links

Hello,

i would love to have the blur effect for text links only, but it seems like the code is also making my linked images blurry. is their a way to avoid this?

i am using following code i guess i found in the forum as well:

a {
    color: #000000;
    transition: ease-in-out 0.2s;
}

a:hover {
    color: #000000;
     -webkit-filter: blur(10px); /* Safari */
    filter: blur(20px);
    transition: ease-in-out 0.2s;
}

Whoever can tell me will make me very happy :)

Have a great day!

Cheers, Max

[MaxWinter]

Hello,

just wanted to push this topic a little bit. If there is a simple solution i could find elsewhere i would be very happy if someone could let me know :)

Could not find an answer to this in the forum.

Have a great day!

Cheers, Max

[Richard]

Dear Max

@MaxWinter

I think i can help 🌝
When a Link has an image inside of it, we would have the 'nesting'

a img{
//insert css here
}

But in most cases with a link and text - the link would have a span element inside wrapping the text:

a span{
// insert css here
}

Because if this we can target only the links that have span within therefore only text links, e.g

a span {
    color: #000000;
    transition: ease-in-out 0.2s;
}

a span:hover {
    color: #000000;
     -webkit-filter: blur(10px); /* Safari */
    filter: blur(20px);
    transition: ease-in-out 0.2s;
}

---

Best wishes Max, have a great weekend

Richard