Changing the color of hrefs

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
JackD
Forum Commoner
Posts: 62
Joined: Sat Dec 12, 2009 6:25 pm

Changing the color of hrefs

Post by JackD »

I tried to find this by searching the past questions, but couldn't. I need to change the color of a displayed link without affecting the color of others. The main URL is http://www.mybfl.com. In the sidebar, we want the links to be displayed in white, rather than the default blue. We also want the visited links displayed in white. So we have the following code:

Code: Select all

<style type="text/css" media="screen"> 
A:link { color: white; }
A:visited { color: white; }
A:hover { color: white; background-color: gray; text-decoration: #000000;}
A:active { color: white; } 
</style>
That part works fine. However, in the body, where we have code such as:

Code: Select all

<td width="239" align='right' border="0"><fieldset class="fieldsetaddressbox"><center><h3><u>North Point Mall:<br></b></u>  
     </h3><Font size="+1">
       	Monday - Saturday<br>
        10 am - 9 pm<br></font>
        <font size="-1">935 North Point Drive
        <br />Alpharetta, GA 30022<br>
        (770) 475-7768<br>
		<a href="mailto:NorthPoint@mybfl.com">NorthPoint@mybfl.com</a></font>
        </center>
        <center><p>
        <a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=935+North+Point+Drive+Alpharetta,+GA+30022&sll=34.051474,-84.282392&sspn=0.034488,0.077162&ie=UTF8&hq=&hnear=935+North+Point+Drive+Alpharetta,+GA+30022&ll=34.051474,-84.282392&spn=0.019601,0.025663&z=14&output=embed&iwloc=near" style="text-decoration:none"><u>Click for Map</u>&nbsp;<img src="images/scroll_icon.gif" width="30" height="30" border="0" align="absbottom"/></a>
        </p></center></fieldset>
     </td>
both the "<a href=..." links is also displayed in white. The body is a light yellow background and the links in white disappear into the background. We have tried a lot of variations such as class, font, etc. to make these links displayed in blue. Is there a way to do that?

Thanks
michaeru
Forum Commoner
Posts: 28
Joined: Sun Mar 07, 2010 5:22 pm

Re: Changing the color of hrefs

Post by michaeru »

Code: Select all

<style type="text/css" media="screen">
A:link { color: white; }
A:visited { color: white; }
A:hover { color: white; background-color: gray; text-decoration: #000000;}
A:active { color: white; }
</style>
 
This will make all anchors white. You should try adding IDs or Classes.

Code: Select all

<style type="text/css">
.sample_class a { color: #FFF; }
</style>
This will make the anchors with the class sample_class white.

Hope that helped, and suggestion. Try to use external CSS. Also try using divs instead of tables. And try to match the size to fit majority of the used resolutions (800 x 600 (Use sumthing like 780 x Any Height) or 1024 x 768 (Use sumthing like 980 x Any Height)).
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: Changing the color of hrefs

Post by pickle »

Moving to the CSS forum.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
JackD
Forum Commoner
Posts: 62
Joined: Sat Dec 12, 2009 6:25 pm

Re: Changing the color of hrefs

Post by JackD »

Thanks for the suggestions. We actually do use external css and html files, it just doesn't show in this example. We'll look into divs instead of tables, and perhaps later you can explain what you meant by your comments on the resolution.

In the meantime, I definitely did not understand your answer as to how to get selected anchors a different color. We have them all set to white in our example, and what selected anchors to be a different color, eg, blue. We have tried different syntax combinations inside <a> such as

Code: Select all

<style type="text/css">
.sample_class a { color: blue; }
</style>
<a class=sample_class; href xxxxxx;>
but none have allowed us to change the anchor from white to blue. What are we missing?
grado
Forum Newbie
Posts: 5
Joined: Thu Jun 17, 2010 10:49 pm

Re: Changing the color of hrefs

Post by grado »

use external CSS file, write separately, write the css file in the same page will easy to make css conflict.
Jimania
Forum Newbie
Posts: 1
Joined: Mon Jun 21, 2010 7:15 pm
Location: Atlanta, GA, USA

Re: Changing the color of hrefs

Post by Jimania »

simply create a unique class for that particular link. it's very easy after that!
Post Reply