CSS Mouse overs

[Harro]

I am doing a small image gallery. I have a border around the images, and on mouse over I want the border to change colour. Now I have got this working in Firfox but obviously I came across some problems in IE because it only supports :hover on the <a> tag. This is the code im using:

a img.gallery {
	width: 25%;
	height: 25%;
	border: 5px solid #8EA113;
	margin: 10px;
}

a:hover img.gallery {
	width: 25%;
	height: 25%;
	border: 5px solid #fff;
	margin: 10px;
}

I was wondering if anyone knows any fixes to get this working in IE. I have came up with a javascript solution, but I would rather hav it done in CSS because the page already has a fair amount of javascript.

Thanks for any help you can give me.
Harro

 

[Dan]

What you used should work..

But if it doesn't, just put the border on the link instead of the image?

 

[Harro]

Hey, thanks for the suggestion, wouldn't you know it, putting the border on the <a> tag works in IE but then looks wrong in FF. I guess im going to have to make a different style sheet for IE if i cant find another way.

Thanks for the suggestion

 

[Dan]

.feat a:link,
.feat a:active,
.feat a:visited {
	border: 10px solid #d1dde9;
	display: block;
	width: 215px;
	height: 150px;
	text-decoration: none;
	overflow: hidden;
	}
.feat a:hover {
	border: 10px solid #b4cee7;
	}

That's from my site (www.css.la) and it works in FF and IE.

 

[Harro]

Thanks for that, works a treat. Nice site by the way too.