Having trouble understanding why the images are not changing color on hover. The images are svg files and should be able to adopt the color. Here is the code snippet:
HTML:
<div class="toolTile col-md-3">
<a href="#/cards">
<img src="ppt/assets/toolIcons/requestnewcard.svg" >
<p>Manage my debit card</p>
</a>
</div>
<div class="toolTile col-md-3">
<a href="#/recurClaim">
<img src="ppt/assets/toolIcons/recurring.svg" >
<p>Recurring Claims</p>
</a>
</div>
And corresponding CSS:
.toolTile {
height: 200px;
float: left;
}
.toolTile img {
color: #ab2328;
height: 100px;
width: 93px;
margin-left: auto;
margin-right: auto;
display: block;
}
.toolTile img:hover {
color: yellow;
}