UI Issue - Image Exceeds <a> Tag Boundaries

[charithmaddoju]

Description:
I noticed a UI issue where an image inside an tag slightly exceeds its boundary, causing the layout to look misaligned. The dimensions of the tag and the image inside it differ, leading to this overflow.

How to Reproduce:

1. Open the website URL.
2. The issue can be immediately noticed on the homepage (or specific page if applicable).

Current Behavior:
When inspecting the tag, the dimensions appear as 144px * 19.2px, while the image inside has dimensions of 144px * 20px. This causes the image to exceed the boundaries of the anchor tag, making it extend slightly out of alignment.

Expected Behavior:
The image should be perfectly contained within the tag without overflow. The dimensions of both should match, ensuring that the UI looks aligned and clean.

Screenshots:
Current Page:

Expected Page:

Suggested Fix:
After applying display: inline-block to the tag, the dimensions align properly, and the image is perfectly contained within the anchor tag.

Request:
I would like to contribute to resolving this issue. Could you please assign it to me?

[charithmaddoju]

I've raised this issue after identifying the UI problem, and I would like to resolve it myself. Please assign the issue to me, and I'll start working on the fix.

[eshellman]

We can consider this in November. Needs testing on a variety of platforms/browsers.

[ayushrskiaa]

@eshellman please assign this issue to me under hacktoberfest. I would like to contribute in this project.

[bhavy3103]

I'm interested in this issue to solve.

[devDEV03]

/assign

[DSK2307]

I am interested in this and want to contribute . Please assign me