Prevent External Link indicator graphic from displaying on images

[rmlumley]

I’ve added the following bit to my CSS:

#content a[target^="_blank"] {

background-image:url(images/extlink.png);

background-repeat: no-repeat;

background-position: right;

padding-right: 12px;

}

This gives a little external link indicator (seen on Wikipedia) on all of the links that open in a new window. The issue is it also does this for linked images. Obviously, I don’t want to have that graphic on images. Anyone have an idea on how to get around this?

In conclusion, I want to use the code above but have it ignore links that are wrapped around images.

[AnonymousBlah]

try adding this to your css:

#content img a[target^="_blank"] {

background-image:url(images/NULL.png);

background-repeat: no-repeat;

background-position: right;

padding-right: 12px;

}

If that doesn’t work, create a transparent image, and link it in the place of NULL.png

[shazdeh]

How about this?

#content a[href$='.png'],

#content a[href$='.jpg'],

#content a[href$='.jpeg'],

#content a[href$='.gif'] {

background-image: none;

}

[Author]

Posts