A img still showing border despite CSS

HTML & CSS
1

Hello all. I had the same exact problem as this guy:

http://csscreator.com/node/28917

and the answer that someone provided worked great! However, we are using a propriatary CMS that is not giving me access to all the linked images. Therefor, I am still stuck looking for another solution where I only need to alter the CSS style sheet, and not the html code.

Any thoughts?

Basically, I turned on underline while hovering over links, which is great for text, but not so great for linked images. I created another class for linked images, but I can’t access all of them to add an attribute.

Thanks, bowie

2

Could you provide a link to your site? The link in that other forum is dead.

3

hover over the get connected images in the lower right. I don’t have access to changing the html code, but only the css, for that particular section.

4

Ah, OK, you’ve removed underlining on the image but not on the <a> itself, so try this:


#connected a:hover {text-decoration: none;}

EDIT: I fixed the link above, as it was broken, but did you want that, or did you not want it linked? (I can unlink it if you like.)

5

right, ok, but there are going to be more images like that, but I guess you are telling me that I have to take it on a case by case basis, as I find them.

6

Yes, it’s not really an issue of images, but an issue of <a> links that have an underline on hover. You could universally set all links to text-decoration: none on hover if you wanted to, but I don’t think that’s what you want, so you’ll need to target just the relevant ones instead, as I did above.

Or, alternatively, you could add a class to any link on which you wanted no text decoration and then serve all such links with one rule. You’d just have to watch out for specificity, though. (EDIT: ah, but that involves changing the HTML, which doesn’t work for you.)

7

ok. thanks.

8

You could hide the decoration like this:




#connected{overflow:hidden}
#connected a img{
	float:left;
	position: relative;
	margin:0 5px -2px 0; 
	border: 0;
}