I have a circle with the following CSS:
width: 106px;
border-radius: 50%;
color: white;
height: 106px;
margin: 0 auto;
box-shadow: 0px 0px 8.73px 0.27px rgba(0, 0, 0, 0.39);
cursor: pointer;
transition: all 0.4s ease-in-out;
background-image: url(/images/plussign.svg);
background-position: center center;
background-size: 30px 30px;
background-repeat: no-repeat;
&:hover {
transform:scale(1.05, 1.05);
}
When I hover over the circle, it scales by 105%. However, the plus sign inside the circle becomes blurry. Is there a fix for this?