I have some icons on my website, which through bootstrap when hovering over them, slightly increase the size. The icons are inside two div
more. I want that when clicking on the icon, in addition to these increasing in size, they take me to another page of my site. I show you one of the div
:
<section class="ulockd-service-three">
<div class="container">
<div class="col-xs-6 col-sm-4 col-md-2">
<div class="ulockd-srvc-column-two one text-center">
<div class="ulockd-srvc-details-two">
<div class="ulockd-srv-icon-two"><span class="flaticon work">
</span>
</div>
<h5>Safety Work</h5>
</div>
</div>
</div>
</div>
</section>
I have tried several ways to insert the link, and finally I found one that redirects me to the desired page, but I don't know if it is the most correct way to do it, it doesn't seem appropriate, it doesn't seem aesthetic.
This is how the link works for me:
<section class="ulockd-service-three">
<div class="container">
<div class="col-xs-6 col-sm-4 col-md-2">
<div class="ulockd-srvc-column-two one text-center">
<div class="ulockd-srvc-details-two">
<a href="about.html"><div class="ulockd-srv-icon-two">
<span class="flaticon-work"> </span>
</div></a>
<h5>Safety Work</h5>
</div>
</div>
</div>
</div>
</section>
What I mean is that if it is within the allowable, taking into account everything, including whether Google liked it or not. Can you tell me the correct way to add a link to the icon without breaking the magnifying effect ?
Thank you
The answer varies depending on the version of HTML you're using:
Therefore, if you are using HTML5 your case is totally valid.