views:

348

answers:

2

I want to be able to link my image. Click on it. Go back to the page and see that it was visited. I want my visited images to have a different color border when I go back.

My code:

a:link img{border-color:#FFF; border-style:solid; border-width:1px;}
a:hover img{border-color:#03F; border-style:solid; border-width:1px;}
a:visited img, a:active img{border-color:#036; border-style:solid; border-width:1px;}

Any ideas would be appreciated.

A: 

It may help to tell us which browser isn't working, because they all handle anchor links that have embedded text differently.

Nick Berardi
+2  A: 

Link CSS can be hard to get right, because many browsers can be quirky about it. The best order to declare link CSS is

  • Link
  • Visited
  • Hover
  • Active

(Also remembered as the mnemonic LoVe/HAte).

Also, try declaring your css:

a:hover img {border: 1px solid #036;}

instead of specifying it in three different declarations.

jacobangel
The link/visited/hover/active order is more important than most people realize. Good suggestion.
David Kolar