Slight difficulties
by admin on Nov.11, 2008, under Uncategorized
So I’ve noticed these external link icons cropping up a lot, such as on Wikipedia, and I thought it would be a good thing to put onto the new KLA site. So here’s the CSS code I’m using to do that:
a[href^="http:"] {
background: url(../images/externalLink.png) no-repeat right top;
padding-right: 10px;
}
a[href^="http://www.kenlongassoc.com"], a[href^="http://kenlongassoc.com"] {
background-image:none;
padding-right:0;
}
The first bit puts in the icon, and of course the second bit keeps it from showing up on internal links, cause that would be stupid. The problem that I’m noticing, is the icon also shows up next to images that are linked, and I’m not sure how to prevent that. It looks bad when next to images, and also moves around my Flickr feed, and that’s just no good. I’m sure I’m just missing something that should be completely obvious, but I need some help on this. So here is my cry for help.
November 11th, 2008 on 4:04 pm
Can’t you just reset it for images?:
a[href^="http:"] img {
background: transparent;
padding-right: 0px;
}
November 11th, 2008 on 4:09 pm
Ignore the above, stupid mistake xD
November 11th, 2008 on 4:36 pm
Looks like it isn’t happening: http://exscale.se/archives/2007/07/24/why-cant-we-select-parent-elements-with-css/ here’s my attempts: http://dev.kerplunc.com/experiments/css_external_links/
November 11th, 2008 on 4:37 pm
Oh (4 comments now, feel free to merge xD), check out http://www.telerik.com/community/forums/aspnet/treeview/select-parent-node-when-child-is-clicked.aspx, might have a js solution, if you want to take that route…