different color links on the same page

[TheCandyman]

I have an issue where my menu is css and i need that to be white, but the links in the body should not be white. I have searched around and found what i think might be the answer, but i can't get it to work. The A.MainPart is for the links i don't want to be white. This is what i have:

<style type="text/css">
<!--
A.MainPart         { color: #00426b; text-decoration: underline; }
A.MainPart:visited { color: #00426b; text-decoration: underline; }
A.MainPart:hover   { color: #FF0000; text-decoration: underline; }
A.MainPart:active  { color: #3366FF; text-decoration: underline; }

.buttonscontainer {width: 166px;}

.buttons a {
color: FFFFFF;
border-bottom: 1px solid;
background-color: 006086;
font: 12px Verdana, sans-serif;
font-weight: bold;
text-decoration: none;
display: block;
margin: 0px;
width: 100%;
text-align: left;
padding-left:12px; padding-right:5px; padding-top:8px; padding-bottom:8px
}

.buttons a:hover {
color: FFFFFF;
border-bottom: 1px solid;
background-color: 5F98B7;
text-decoration: none;
padding-left:12px; padding-right:5px; padding-top:8px; padding-bottom:8px;
}
-->
</style>

<div class="buttonscontainer">
<div class="buttons">
  <a href="index.asp">Home</a>
</div></div>


<span class="MainPart">
 bulk of text and links....
</span>

 

[FesterSXS]

nearly - Firstly change <span class="MainPart"> to <div id="MainPart">

<div> is a block element as opposed to an inline element like <span> and is therefore the more appropriate to use for containing other HTML code.

Next, change your styles like so:

#MainPart a { color: #00426b; text-decoration: underline; }
#MainPart a:visited { color: #00426b; text-decoration: underline; }
#MainPart a:hover { color: #FF0000; text-decoration: underline; }
#MainPart a:active { color: #3366FF; text-decoration: underline; }

Tony

Spirax-Sarco - steam traps control valves heat exchangers
Sun Villa - Luxury Florida accommodation

 

[Vragabond]

Per your solution, you will need to give a class named MainPart to all the links that you do not want to be white. Since you mention that links in the body (sounds like the main part) should look as if with a class, I would advise against this method. In your code, the correct syntax for what you want would be:

.MainPart a         { color: #00426b; }
.MainPart a:visited { color: #00426b; }
.MainPart a:hover   { color: #FF0000; }
.MainPart a:active  { color: #3366FF; }

However, you could opt to leave the whole .MainPart out anyway and make all your links look like that except the ones within a div with a class buttons.