remove link underline from image only if the anchor tag contains an img

Question

for the above html code I am using the fol

Answer 1

After a lot of Googling I finally found a neat trick that worked for me:

a img { border:none; vertical-align:top; }

Why this works?

By default both anchors and images are inline elements and by applying vertical-align:top; to an image inside an anchor, we move the anchor to the top of the image. For some reason images have higher z-index than anchors.

Source: Remove Border from Image Links

By the way, it would work great with a parent selector like a < img ... unfortunately this isn't implemented yet, but is in the workings. Take a look here: https://stackoverflow.com/a/45530/114029