View Full Version : A:Link color not Working in external stylesheet - PLS Help
Ricko 01-02-2006, 02:46 AM Hi,
I have an external stylesheet which I've checked a million times for errors and it seems ok. The a: link colour will not work (just shows standard blue colour) when viewed in firefox or IE. The hover works in IE but not firefox. Need to get a:link color working.
CSS external code is:
a:link {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
}
a:visited {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
}
a:hover {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
font-variant: normal;
}
a:active {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
font-variant: normal;
}
Now I've also checked the document (webpage) and can't find any inline font colours that could override the stylesheet. The web page is: http://www.youth-action.net/test/contact.shtml
Any ideas People ????
Rick
it might be because your links are inside a SPAN with a class assigned to it.
try adding this to your style sheet to test it...
.SideSubMenu a:link {
color: #FF6600;
}
Ricko 01-02-2006, 10:20 AM Hi,
I have taken the SPAN Code out and now the portion of my webpage is as follows:
<div id="masterdiv">
<div class="menutitle" onclick="SwitchMenu('sub1')">
<div align="left"><img src="../images/Menu/projects_off.gif" srcover="../images/Menu/projects_on.gif" srcdown="../images/menu/projects_down.gif"alt="Youth Action Projects" name="Menu_news" width="130" height="25" border="0"></div>
</div>
<p>- <a href="summer_project_2005.shtml">Summer
2005 Project</a><br>
- <a href="great_hucklow.shtml">Great
Hucklow</a><br>
- <a href="heritage_project.shtml">Heritage Project</a><br>
- <a href="home_front_recall.shtml">Home Front Recall</a>
<br>
</p>
</div></td>
</tr>
<tr>
<td><div class="menutitle" onclick="SwitchMenu('sub2')">
<div align="left"><img src="../images/Menu/training_off.gif" srcover="../images/Menu/training_on.gif" srcdown="../images/menu/training_down.gif"alt="Youth Action Projects" name="Menu_news" width="130" height="25" border="0"></div>
</div>
- <a href="1.htm">Training
1</a><br>
- <a href="2.htm">Training 2</a><br>
- <a href="3.htm">Training 3</a></font><br>
<br>
</div>
I've also added the color to the stylesheet for the sidemenu the css file is now as follows:
a:link {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
}
a:visited {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
}
a:hover {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
font-variant: normal;
}
a:active {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
font-variant: normal;
}
.maintext {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: #000000;
}
.headingONE {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
font-variant: normal;
text-transform: uppercase;
color: #000000;
height: auto;
width: auto;
border-top: thin none #FF0000;
border-right: thin none #FF0000;
border-bottom: thin none #FF0000;
border-left: thin none #FF0000;
background-color: #CCCCCC;
}
.headingTWO {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
line-height: normal;
font-weight: bold;
font-variant: normal;
color: #FF0000;
text-transform: uppercase;
}
.SideSubMenu {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: #FF6600;
}
Unfortunately, it's still not working. The colour is just not there on links. I tried using green (without the hex code) and it still don't work. Any more suggestions pls...
Ricko 01-02-2006, 10:28 AM I've added the code to the stylesheet wrong on my last post:
The code is:
a:link {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
}
a:visited {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
}
a:hover {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
font-variant: normal;
}
a:active {
color: #FF6600;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
font-weight: bold;
font-variant: normal;
}
.maintext {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: #000000;
}
.headingONE {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
font-variant: normal;
text-transform: uppercase;
color: #000000;
height: auto;
width: auto;
border-top: thin none #FF0000;
border-right: thin none #FF0000;
border-bottom: thin none #FF0000;
border-left: thin none #FF0000;
background-color: #CCCCCC;
}
.headingTWO {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
line-height: normal;
font-weight: bold;
font-variant: normal;
color: #FF0000;
text-transform: uppercase;
}
.SideSubMenu a:link {
color: #FF6600;
}
.SideSubMenu {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: #FF6600;
}
The additional sidesubmenu a:link seems to have no effect. I've tried refreshing the page loads of times and the colour is still the standard blue. Can't think what might be causing this ?
I have taken the SPAN Code out
why did you do that?
i just suggested adding in a bit of css coding so it would (possibly) work inside that span area.
you've added the css part, but now it doesnt have anywhere to go.
Ricko 01-02-2006, 09:01 PM One of those things, I guess. I put the span back and used the more accurate CSS references you mentioned and now it works a treat. Must be something about the SPAN which stopped it working with the old a:link.
Anyway, thanks for your help !!
Rick
ok. hope things go smoother for ya.
|