Hubble Landing Page Alt Features Solution

How come on Chrome when I hover over the social media icons, only when I'm hovering over the top left of them does the color change? On Firefox it changes no matter where I'm hovering.

When I used an svg from my images folder for the social media icons, the color property was not working so I had to use filter. Here I'm getting the svg's from ionic.io and now the color property works. Why is this?

Any other advice or criticisms welcome, thank you!