[SOLVED] Underlined Links using pictures

[Dracolas]

I read that to get rid of Underlines on links you put

a {text-decoration:none}

 

but when I do this in my style.css the lines are still there.... why is this?

 

Thank you for your help ahead of time!

 

Dracolas

[Dorky]

a {text-decoration:none;}

[merylvingien]

Basic link without underline

a:link {text-decoration:none;}

 

If you want a link that has been visited to not be underlined:

 

a:visited {text-decoration:none;}

 

If you want a link that is hovered over to BE underlined so its obvious that it is a link

 

a:hover {border-bottom:1px dotted;}

 

You forgot to add the ; at the end of your code...

 

[seanlim]

I'm pretty sure the semi-colon at the end does not matter if that is the last property defined... does it?

 

Anyway, like what merylvingien said, you should use the pseudo-classes when defining styles for anchor elements. Remember also that the order in which the pseudo-classes are defined is important.

 

a:hover must be declared after a:link and a:visited.

 

a:active can also be used, but it must be declared after the above 3 pseudo-classes.

[Dracolas]

Ok i put

a:link {text-decoration:none;}
a:visited {text-decoration:none;}

 

in my style.css and it's still not working.... any other ideas guys?

[seanlim]

Check that there aren't any other definitions that overwrites your definition.

 

For example, if you have a container div with id="container", then:

 

#container a:link{ ... }

 

will overwrite

 

a:link{ ... }

 

regardless of where these definitions are declared relative to each other. Remember to check any external stylesheets too.

[sticks464]

You can also add

img {border:0;}

 

[Dracolas]

Ok the problem was that the links were in my .nav div and i was putting the a:... in the main portion of the style.css. I added the a:... to the .nav section and it fixed it!

 

Thank you guys!