4

I have the following style for my footers in my css file:

#footer { 
    text-align: center;
    font-size: .7em;
    color:#000000;
}

This is the html for the footer part:

<div id="footer">
   <br> //google ad
   <br>
   <br>
   <A HREF="http://www.site1.com">Blog</A>&nbsp;&nbsp;&nbsp;<A     
   HREF="http://site1/rss.xml">RSS</A>&nbsp;&nbsp;&nbsp;<A 
   HREF="http://www.mexautos.com">Autos Usados</A>&nbsp;&nbsp;&nbsp;<A 
   HREF="http://www.site2">Videos Chistosos</A>&nbsp;&nbsp;&nbsp;<A 
   HREF="http:/s.blogspot.com">Fotos de Chavas</A><br>
   Derechos Reservados &copy; 2008-<?=date('Y')?> address<br>
</div>

But for some reason some of the links show underlined.

Any ideas how I can make it so the links do not appear underlined?

Thx

Improve this question
1
  • 1
    you're hurting my eyes with uppercase tags :( Commented Jun 29, 2009 at 12:40

5 Answers 5

Reset to default
15

you can try

#footer a { text-decoration: none }

that means all <a> tags within the element with id footer will have no underline.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Argh damnit, you were faster^^
I might be being unnecessarily "nitpicky" - but not necessarily all a tags...something with a higher specificity could override what you put above. I have ran into problems with this before and could never figure out why it didn't work. Just an FYI.
to have the highest specificity, we need <a style="text-decoration: none">click me</a> but usually that's not recommended unless we really need to.
10

try:

#footer a{ 
   text-decoration: none;
}
Improve this answer

Comments

8

Apply the following style:

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

I've intentionally given you complete coverage of all the states that an <a> tag can have, but you very well may be able to get away with the following as well:

a
{
    text-decoration: none;
}

Finally, if you only want this applied to the footer:

#footer a, #footer a:link, #footer a:visited, #footer a:hover
{
    text-decoration: none;
}
Improve this answer

Comments

3

Not a direct answer to your question, but I'd highly recommend installing Firebug in Firefox as it allows you to see what classes are applied and it what order - essentially helping you to debug your CSS.

Improve this answer

Comments

2

Add the following line to your stylesheet:

a {text-decoration:none;}
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.