"A Href" link causing an image to change size
Posted: Thu Dec 19, 2019 12:27 pm
I have this code currently and it displays the image perfectly:
<div class="image-button mt-2 mb-2"><img onmouseover="changee_image(this);" onmouseleave="changee_main(this);" src="../../images/frontpageimages/yellowbtn.png" alt="" data-src="../../images/frontpageimages/4f6ec0_327f7c30b9db4f4ab8049535ad84f6ac.jpg" /></div>
When I add the link to the code to make the image a clickable link (It's a button), it causes the image to get substantially smaller on the horizontal axis:
<div class="image-button mt-2 mb-2"><a href="index.php?option=com_content&view=article&id=16:the-shop-rig&catid=11:blog" target="_blank"><img onmouseover="changee_image(this);" onmouseleave="changee_main(this);" src="../../images/frontpageimages/yellowbtn.png" alt="" data-src="../../images/frontpageimages/4f6ec0_327f7c30b9db4f4ab8049535ad84f6ac.jpg" /></a></div>
I have tried to add the link code outside the div, but it still behaves the same.
In 20+ years of building websites, I have never seen this happen. When you make an image clickable, it shouldn't alter the image display in any way.
Anyone have any thoughts on this?
Thanks in advance.
<div class="image-button mt-2 mb-2"><img onmouseover="changee_image(this);" onmouseleave="changee_main(this);" src="../../images/frontpageimages/yellowbtn.png" alt="" data-src="../../images/frontpageimages/4f6ec0_327f7c30b9db4f4ab8049535ad84f6ac.jpg" /></div>
When I add the link to the code to make the image a clickable link (It's a button), it causes the image to get substantially smaller on the horizontal axis:
<div class="image-button mt-2 mb-2"><a href="index.php?option=com_content&view=article&id=16:the-shop-rig&catid=11:blog" target="_blank"><img onmouseover="changee_image(this);" onmouseleave="changee_main(this);" src="../../images/frontpageimages/yellowbtn.png" alt="" data-src="../../images/frontpageimages/4f6ec0_327f7c30b9db4f4ab8049535ad84f6ac.jpg" /></a></div>
I have tried to add the link code outside the div, but it still behaves the same.
In 20+ years of building websites, I have never seen this happen. When you make an image clickable, it shouldn't alter the image display in any way.
Anyone have any thoughts on this?
Thanks in advance.