Combining a:link a:visited a:hover within a style

Hi all,

This style is not working and I'm sure you can tell me why :)

It's the a:link a:visited a:hover portion.  And it needs to be compatible in both IE and Firefox.

.style3 {
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold;
      color: #FFFF00;
      font-size: 12px;
      font-style: normal;
      font-variant: normal;
a:link { color:  #FFFF00;; }
a:visited { color:  #FFFF00;; }
a:hover { color:  #FFFF00;; }
}

Thanks

Rowby
LVL 9
Rowby GorenAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

ResQTek NancyPresident @ ResQTekCommented:
This is what I would try:

.style3 {
     font-family: Arial, Helvetica, sans-serif;
     font-weight: bold;
     color: #FFFF00;
     font-size: 12px;
     font-style: normal;
     font-variant: normal;

     a:link, a:visited, a:hover { color: #FFFF00; }
}

What is the problem you are encountering?
Rowby GorenAuthor Commented:
Hi Nancy,

Thanks for helping.

Can't figure out the problem. Here's the page with your style:

http://rowby.com/shows/20051116.html

I want the links to be yellow font with no underline, including hovered, and visited, etc.

Here's the existing style in the header:
<style type="text/css">
<!--
.style1 {font-family: Arial, Helvetica, sans-serif}
.style3 {
     font-family: Arial, Helvetica, sans-serif;
     font-weight: bold;
     color: #FFFF00;
     font-size: 12px;
     font-style: normal;
     font-variant: normal;
     a:link, a:visited, a:hover { color: #FFFF00; }
}

body {
      background-color: #0000FF;
}

-->
</style>

ResQTek NancyPresident @ ResQTekCommented:
Sorry, I meant to draft it this way...

<style type="text/css">
<!--
.style1 {font-family: Arial, Helvetica, sans-serif}
.style3 {
     font-family: Arial, Helvetica, sans-serif;
     font-weight: bold;
     color: #FFFF00;
     font-size: 12px;
     font-style: normal;
     font-variant: normal;
}

a.style3:link, a.style3:visited, a.style3:hover {
color: #FFFF00;
text-decoration: none;
}

body {
     background-color: #0000FF;
}

-->
</style>

<body>

<p>testing text and <a class="style3" href="#">link</a></p>

</body>

Also, you'll need to specify the class in each anchor tag to match the style on the anchor elements unless the whole page is using the same skin.
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

Rowby GorenAuthor Commented:
Hi Nancy,

ALmost there:
http://rowby.com/shows/20051116.html

The other text in style3 also needs to be yellow like the linked text.

Right now it's black.

Rowby
ResQTek NancyPresident @ ResQTekCommented:
Yes, you need to specify the class "style3" within every element that needs it.

<p class="style3">Testing text and <a class="style3" href="#">link</a></p>
smaccariCommented:
You can also define this like this, so as no need to add a style3 class name in your anchors: (only in their container)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>The Rowby Fan Club</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.style1 {font-family: Arial, Helvetica, sans-serif}
.style3 {
     font-family: Arial, Helvetica, sans-serif;
     font-weight: bold;
     color: #FFFF00;
     font-size: 12px;
     font-style: normal;
     font-variant: normal;
}

.style3 a:link, .style3 a:visited, .style3 a:hover {
color: #FFFF00;
text-decoration: none;
}

body {
     background-color: #0000FF;
}

-->
</style>

<body>

<p class="style3">testing text and <a href="#">link</a></p>

</body>
</html>

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
ResQTek NancyPresident @ ResQTekCommented:
Oooo, I like that!
Rowby GorenAuthor Commented:
Thanks smaccari and Nancy2k5

For your help  It's working fine now.  Text and link!

http://rowby.com/shows/20051116.html
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Fonts Typography

From novice to tech pro — start learning today.