Posted by tshad on 08/02/07 17:09

My links/anchors in my site are a turquoise color.

a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
}
a:link {
color:#3EA2BC;
}
a:active {
color:#3EA2BC;
}

I have some tags I want to be a different color so I set up a class -
bodybold.

It seems the way I do it with my menu list doesn't work for my other links
For my menu Links I do it this way:

..nav-menu li a
{
height: 2em;
line-height: 2em;
color: #666666; /* Color of the Link - need to change it for a:visited as
well */
text-align: center;
margin: 0;
padding: 0;
font-weight: bold;
}
..nav-menu li a:visited
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}

The class name, then the list, then the link. This is then applied as so:

<div class="nav-menu" >
<ul>
<li><asp:HyperLink ID="HomeMenu" Text="Home" NavigateUrl="home.aspx
runat="server"/></li>
<li><asp:HyperLink ID="ViewBasicMenu"
NavigateUrl="viewPositionsNS.aspx?type=Basic" Text="Basic Search"
runat="server"/></li>
</ul>
</div>

This doesn't work for my normal links:

My <a> is:

<a class="bodybold" href="file:///C|/Inetpub/wwwroot/media_kit">media</a>

I tried this first:

..bodybold
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

That didn't work.

I then realized that I needed to specifically set the <a> specifically as I
do with my list menus, so I now have:

..bodybold a
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

..bodybold a:link
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
This still didn't work work. But then I did this which did work.

a.bodybold:link
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

Why didn't the previous ones work?

Thanks,

Tom.

• Next in forum: Re: Hey Spacey, Have You Tried This?
• Prev in forum: Re: Positioning Dynamic menus
• Thread view: Anchor colors

[Reply to this message]