I am currently working on adding hover effects to my elements. I have successfully added a hover effect to the outer list item, but I am wondering how I can achieve the same effect on the <input> element instead of the <li>.
ul.slides li:hover {
border:2px solid #701344;
}
<div class="albums-div">
<ul class="slides" style="width:148px; height:148px">
<?php
foreach($rings as $ring)
{
echo '<li> <input class="teringimage" type="image" src="'. $ring['ringThumbNailImagePath'] .'" name="checked" value="' . $ring['id'].'" data-my-info="'. $ring['ringSetName'] .'" style="width:108px; height:108px;"></li>';
}
?>
</ul>
</div>