• Howdy! Welcome to our community of more than 130.000 members devoted to web hosting. This is a great place to get special offers from web hosts and post your own requests or ads. To start posting sign up here. Cheers! /Peo, FreeWebSpace.net
managed wordpress hosting

CSS Issues

Dan

Bullah
NLC
Hey folks,

I am in the middle of doing a design. I want to use just one stylesheet to take care of the CSS for me. But I have a problem.

One part of the page is colored in say #3366ff and has Hyperlinks.
Another part of the page is colored white and also has Hyperlinks.

Here is an example of the way the CSS is done for part A and part B. Makes it easier to explain:

Code:
.parta {
color: #222222;
background: #ffffff;
}
.partb {
color: #F1F1F1;
background: #3366FF;

Now, for them both to have separate hyperlink styles, I was certain I could do it this way:

Code:
.parta a:link, a:visited, a:active {
color: #494949;
}
.parta a:hover {
color: #282828;
And use the similar style in partb but different colors. But it doesn't work. It will either use one or the other on both or if there is a master style for links etc in the document, it uses that.
I was certain this would work.
Anyone have any ideas why not, or if it should?
 
You need to use classes.

HTML:
<style>
a.link_one:link { color: #FFFFFF; }
a.link_one:visited { color: #FFFFFF; }
a.link_one:active { color: #FFFFFF; }
a.link_one_sub:hover { color: #FFFFFF; } /* notice the difference, add the class to the hyperlink you wish to change */
</style>

Then to use it,

HTML:
<a class="link_one" href="http://www.internetz.com"></a>
<a class="link_one_sub" href="http://www.internetz.com"></a>
 
Last edited:
dan, do this...

HTML:
<style>
.parta a:link, .parta a:visited, .parta a:active {
color: #3366ff;
}
.partb a:link, .partb a:visited, .partb a:active {
color: #FFF;
}
</style>
<div class="parta">
text and <a href="#">links</a> should be one color here.
</div>
<div class="partb">
text and <a href="#">links</a> should be another color here.
</div>
 
Back
Top