<pre><code>.footer__features-item:nth-child(1)::after:hover
</code></pre>That&#39;s definitely the most annoying css selector I have ever written.

```
.footer__features-item:nth-child(1)::after:hover
```

**That's definitely the most annoying css selector I have ever written.**


I&#39;m not aware if <code>:hover</code> works on pseudo elements or not..
However, I&#39;m curious, what are you trying to accomplish with this? Why write a hover condition for a pseudo element?

I'm not aware if `:hover` works on pseudo elements or not..

However, I'm curious, what are you trying to accomplish with this? Why write a hover condition for a pseudo element?


I&#39;m trying to use a transparent (opacity) background image which can only be used with the after pseudo element. I am also using different background images for similar sections so I have the nth-child. Then I also want this transparent background image to be visible on hover.
How I&#39;m sure there&#39;s another way to solve this. I just stumbled in this direction and realized how absurd the entire selector is.

I'm trying to use a transparent (opacity) background image which can only be used with the after pseudo element. I am also using different background images for similar sections so I have the nth-child. Then I also want this transparent background image to be visible on hover.

How I'm sure there's another way to solve this. I just stumbled in this direction and realized how absurd the entire selector is.


I can't seem to get this to work.

Product

Explore

Company

Blogs

Support