on a:link and its effects on <a href><img></a>

[quipy]

this is the code on my page:
<style type="text/css">
<!--
a { text-decoration: none}
a:link { border-bottom: dotted 1px #FFFFFF; color: #000000; }
a:visited { border-bottom: dotted 1px #FFFFFF; color: #000000; }
a:active { border-bottom: solid 1px #FFFFFF; color: #FFFFFF; }
a:hover { border-bottom: solid 1px #FFFFFF; color: #FFFFFF; }
-->
</style>

but i don't want to code to affect images with links. <a href><img></a> any ideas?

[Wavelan]

Well, give the links with the image a separate class like

<a href class="image"><img></a>

then in the CSS write

a.image {
border: none;
}

Only way I can think of doing it right now, there might be other ways.

[Wizardx8]

Try this:

a.links {
  text-decoration:none;
  }

a.links:visited {
  border-bottom:dotted 1px #fff;
  color:#000000;
  }

a.links:active {
  border-bottom:solid 1px #fff;
  color:#fff;
  }

a.links:hover {
  border-bottom:solid 1px #fff;
  color:#fff;
  }

This means that all links using the class "links" will be effected.

Now for your link code, use:

<a class="links" href="www.website.com">Link</a>

Try that, should work perfectly

If you wanted to have different css properties for the img links, you could simply set a different class for them

Edit: Beat me to it