CSS- target text links with bottom border on hover, but image links with no border

Question

I\'d like to be able to target text links in CSS with border-bottom on hover, but have all links that are images not have a border on hover. So:

Answer 1

As far as JavaScript goes, I’d suggest using jQuery to add a class to all links that contain an image:

$('#sidebar a:has(img)').addClass('image-link');

(The :has selector is a jQuery thing; it isn’t present in CSS.)

Then adjust your stylesheet accordingly.

#sidebar a:hover {
  border-bottom: 1px dotted red;
}
#sidebar a.image-link:hover {
  border-bottom: none;
}