Jump to content

image link style problem

Guest jt_sea

Recommended Posts

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 post
Share on other sites

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 post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...