Guest jt_sea Posted October 27, 2005 Share Posted October 27, 2005 I'm trying to set a link style for thumbnail images I have on my site but am having difficulty getting the style to take over the a { } and a:hover { } styles. Here is an example of the styles I have set; a { color: #005D93; text-decoration: none;}a:hover { color: #990000; text-decoration: underline;}#thumb { position: relative; float: left; padding-left: 25px; padding-bottom: 10px;}#thumb img { width: 116px; height: 165px;}#thumb img a { text-decoration: none; border: 2px; border-color: #F5F6F7; border-style: solid;}#thumb img a:hover { border-color: #990000;} An example image tag is as follow; <div id="thumb"><a href="details/page2.html" onclick="NewWindow(this.href,'name','640','460','yes');return false;"><img src="Images/2714.jpg"></a></div> With the above mentioned, the thumbnail is surround by the a color of #005D93 and not the border color I expected. An example can be seen here - Example. I know it must be something fairly obvious I'm missing. Any help would be greatly appreciated.Regards,JT Link to comment Share on other sites More sharing options...
actionsketch Posted October 28, 2005 Share Posted October 28, 2005 The sequence is wrong... in your css, you're accessing an anchor tag within an image tag within the thumb id... but what you want is an image tag within an anchor tag within the thumb id.I'm not sure if#thumb a:hover img{} is allowed though... so you have to do:#thumb a img:hover{} but then this isnt supported in IE6, although it should be once IE7 comes out... and of course it's already supported in FireFox Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now