Hover css code for SVG element

I want to give an svg a hover effect.

Have now added this:
.svg:hover {
fill: #e40613;
}

But this doesn’t work.

It’s hard to tell without seeing the HTML code, but it looks like you’ve a typo in your CSS code:

.svg would refer to a class called “svg”, I assume you intend to target the svg element directly, so you need to omit the dot.

.svg:hover{} would target <svg class="svg"></svg>
svg:hover{...} would target <svg></svg>.

You most likely need the latter.

1 Like