473,405 Members | 2,167 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,405 software developers and data experts.

Override of link colors in CSS class?

Please hlep with a very frustrating problem. I need to be able to have a
reference to my "btcopyrights" CSS class override the link colors first
specified earlier in the CSS.

I inherited a large site with a CSS containing as its first lines:

A:link
{
COLOR: #006633;
BACKGROUND-COLOR: transparent;
TEXT-DECORATION: underline
}
A:visited
{ ...continuing with an entry for link, visited, hover, and active.

Later in the CSS, there is a class set up like this:

..btcopyrights
{
FONT-SIZE: 9px;
COLOR: #ffffff;
BACKGROUND-COLOR: #000000
}

I need to find a way to have the "btcopyrights" CSS class override the link
colors first specified earlier in the CSS (basically to make them all
white - in this one link) - without changing the basic structure of the
CSS...something that would require code changes to hundreds of pages.

It would also require a great deal of work to change the actual link line
iteself, as it also appears in many, many pages. Somehow I need that single
line, when it uses the btcopyrights class, to simply pick up all white link
attributes.

The actual A tag link I need to have this change affect is...with normal
HTML tag delimiters < changed to [ and > changed to ]...

[td class="btcopyrights"]
[div align="center">Entire Site Contents 2006 Company Name Went Here.
All rights reserved. [A href="terms.asp" target=""] Terms of Service
[/A][/div]
[/td]
Can anyone help?

Thanks very much.

May 14 '06 #1
9 4146
"Richard" <no****@yahoo.com> wrote:
Please hlep with a very frustrating problem. I need to be able to have a
reference to my "btcopyrights" CSS class override the link colors first
specified earlier in the CSS.

I inherited a large site with a CSS containing as its first lines:

A:link
{
COLOR: #006633;
BACKGROUND-COLOR: transparent;
TEXT-DECORATION: underline
}
A:visited
{ ...continuing with an entry for link, visited, hover, and active.

Later in the CSS, there is a class set up like this:

.btcopyrights
{
FONT-SIZE: 9px;
Bad idea. IE users can't resize text sized in pixels without digging
through several menus.
COLOR: #ffffff;
BACKGROUND-COLOR: #000000
}
I need to find a way to have the "btcopyrights" CSS class override the link
colors first specified earlier in the CSS (basically to make them all
..btcopyrights a:link {
color: #fff; background: #000;
}
white - in this one link) - without changing the basic structure of the
CSS...something that would require code changes to hundreds of pages.
Eh? Did you mean HTML when you said CSS?

The actual A tag link I need to have this change affect is...with normal
HTML tag delimiters < changed to [ and > changed to ]...
No need to do that. Usenet is a pain text medium.
[td class="btcopyrights"]
[div align="center">Entire Site Contents 2006 Company Name Went Here.
All rights reserved. [A href="terms.asp" target=""] Terms of Service
[/A][/div]
[/td]


What's the point of the <div align="center">? You can just add
text-align: center; to the CSS for .btcopyrights
And what's with the target=""?

Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
May 14 '06 #2
To further the education of mankind, "Richard" <no****@yahoo.com>
vouchsafed:
Please hlep with a very frustrating problem. I need to be able to have
a reference to my "btcopyrights" CSS class override the link colors
first specified earlier in the CSS.

I inherited a large site with a CSS containing as its first lines:

A:link
{
COLOR: #006633;
BACKGROUND-COLOR: transparent;
TEXT-DECORATION: underline
}
A:visited
{ ...continuing with an entry for link, visited, hover, and active.

Later in the CSS, there is a class set up like this:

.btcopyrights
{
FONT-SIZE: 9px;
COLOR: #ffffff;
BACKGROUND-COLOR: #000000
}

I need to find a way to have the "btcopyrights" CSS class override the
link colors first specified earlier in the CSS (basically to make them
all white - in this one link) - without changing the basic structure
of the CSS...something that would require code changes to hundreds of
pages.
..btcopyrights,.btcopyrights a:link,.btcopyrights a:visited,.btcopyrights
a:hover,.btcopyrights a:active {
background:black;
color:white;
text-align:center;
}
It would also require a great deal of work to change the actual link
line iteself, as it also appears in many, many pages. Somehow I need
that single line, when it uses the btcopyrights class, to simply pick
up all white link attributes.

The actual A tag link I need to have this change affect is...with
normal HTML tag delimiters < changed to [ and > changed to ]...

[td class="btcopyrights"]
[div align="center">Entire Site Contents 2006 Company Name Went
Here.
All rights reserved. [A href="terms.asp" target=""] Terms of Service
[/A][/div]
[/td]


Using align="..." on a div is bad. The "target" is either useless or
detrimental. Suggest:

<td class="btcopyrights">All rights reserved. <a href="terms.asp">Terms
of Service</a>

--
Neredbojias
Infinity has its limits.
May 14 '06 #3
> .btcopyrights,.btcopyrights a:link,.btcopyrights a:visited,.btcopyrights
a:hover,.btcopyrights a:active {
background:black;
color:white;
text-align:center;
}


I do this also:

#top-link a { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:link { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:visited { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:active { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:hover { text-decoration:none; color:#CCCCCC;
font-weight:normal; }

I find this easier to read (I assume the top line corresponds with the first
element of your example above - is this correct?)

When setting this stuff - should it always be done as a set, that is, all 5: a,
link, visited, active, hover? If one of these is left out (hover, for instance)
is that an error?

And what about leaving background-color out? This results in a level 1 warning
when trying to validate the CSS... but if I am using a textured background image
on the page, how do I specify a background-color??

May 15 '06 #4
To further the education of mankind, "deko" <de**@nospam.com>
vouchsafed:
.btcopyrights,.btcopyrights a:link,.btcopyrights
a:visited,.btcopyrights a:hover,.btcopyrights a:active {
background:black;
color:white;
text-align:center;
}
I do this also:

#top-link a { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:link { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:visited { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:active { text-decoration:none; color:#CCCCCC;
font-weight:normal; }
#top-link a:hover { text-decoration:none; color:#CCCCCC;
font-weight:normal; }

I find this easier to read (I assume the top line corresponds with the
first element of your example above - is this correct?)


Not really. .btcopyrights is the classname for a div which has a link as
part of its content.
When setting this stuff - should it always be done as a set, that is,
all 5: a, link, visited, active, hover? If one of these is left out
(hover, for instance) is that an error?
Not really. If you're not concerned with hover or active or
differentiating visited with non-visited, 'a' is enough. If you just
wish to do the latter, a:link and a:visited will suffice. In the
originally-posted example, however, those 4 link attributes were set on
links in general so it's at least prudent to reset them all on subsequent
named or classed links.
And what about leaving background-color out? This results in a level
1 warning when trying to validate the CSS... but if I am using a
textured background image on the page, how do I specify a
background-color??


Exactly! The (supposed) high-level warning is a bogosity. I could
understand an "advisory" or something, but what choice does one have with
a random background? The validator (still) also flags "line-height:0;"
so it can be more prissy than perfect, just like it had a real but
fallible brain.

--
Neredbojias
Infinity has its limits.
May 15 '06 #5
Shortened for legibility:

a { text-deco:none; color:#00F; }
a:link { text-deco:none; color:#00F; }
a:visited { text-deco:none; color:#00F; }
a:active { text-deco:none; color:#00F; }
a:hover { text-deco:underline; color:#00F; }
I find this easier to read (I assume the top line corresponds with the
first element of your example above - is this correct?)


Not really. .btcopyrights is the classname for a div which has a link as
part of its content.


What, then, is 'a'? - and why do I need it?
When setting this stuff - should it always be done as a set, that is,
all 5: a, link, visited, active, hover? If one of these is left out
(hover, for instance) is that an error?


Not really. If you're not concerned with hover or active or
differentiating visited with non-visited, 'a' is enough. If you just
wish to do the latter, a:link and a:visited will suffice.


I see. All I really care about is that the link never changes color and I get
an underline (only) on hover.

Therefore, the below code should work - yes? (I know 'deco' is pseudo code):

a:link { text-deco:none; color:#00F; }
a:visited { text-deco:none; color:#00F; }
a:hover { text-deco:underline; color:#00F; }

Do I need to include that silly 'a'?
And what about leaving background-color out? This results in a level
1 warning when trying to validate the CSS... but if I am using a
textured background image on the page, how do I specify a
background-color??


Exactly! The (supposed) high-level warning is a bogosity. I could
understand an "advisory" or something, but what choice does one have with
a random background? The validator (still) also flags "line-height:0;"
so it can be more prissy than perfect, just like it had a real but
fallible brain.


Thanks for the clarification on this - I will stop looking for a transparent
color designation :)
May 15 '06 #6
On Mon, 15 May 2006, deko wrote:
I see. All I really care about is that the link never changes color


Fortunately, I've got a user stylesheet which will out-vote you on
that :-}
May 15 '06 #7
In article <tb******************************@comcast.com>, deko
<de**@nospam.com> writes
a:link { text-deco:none; color:#00F; }
a:visited { text-deco:none; color:#00F; }
a:hover { text-deco:underline; color:#00F; }

Do I need to include that silly 'a'?
That "silly" 'a' is what tells the CSS that you are styling a link.
Without it, you would have a hard job setting visited and hover styles.
No, not impossible, but why make life hard on yourself?

What do have against the 'a' anyway?

<snip>Thanks for the clarification on this - I will stop looking for a
transparent color designation :)


Well, there is a value "transparent" that you can use for color...

background-color: transparent;

but that also gives an advisory warning in the validator for the same
reasons that leaving out the declaration does!!

HTH

--
Alan Silver
(anything added below this line is nothing to do with me)
May 15 '06 #8
To further the education of mankind, "deko" <de**@nospam.com>
vouchsafed:
What, then, is 'a'? - and why do I need it?
You don't.
When setting this stuff - should it always be done as a set, that
is, all 5: a, link, visited, active, hover? If one of these is left
out (hover, for instance) is that an error?


Not really. If you're not concerned with hover or active or
differentiating visited with non-visited, 'a' is enough. If you just
wish to do the latter, a:link and a:visited will suffice.


I see. All I really care about is that the link never changes color
and I get an underline (only) on hover.

Therefore, the below code should work - yes? (I know 'deco' is pseudo
code):

a:link { text-deco:none; color:#00F; }
a:visited { text-deco:none; color:#00F; }
a:hover { text-deco:underline; color:#00F; }


Uh huh. What I'd do is:

a:link,a:visited { color:radish;background:celery;text-decoration:none; }
a:hover { text-decoration:underline; }
Do I need to include that silly 'a'?
For the above, I think you can:

a { color:radish;background:celery;text-decoration:none; }
a:hover { text-decoration:underline; }

(Try it and let me know.) (PS: Use real colors.)
Thanks for the clarification on this - I will stop looking for a
transparent color designation :)


I used to do like:

a:hover ( color:blue;background:transparent; }

....but the validator bolluxed that now.

--
Neredbojias
Infinity has its limits.
May 15 '06 #9
On Mon, 15 May 2006 04:11:01 -0700, "deko" <de**@nospam.com> wrote:
I see. All I really care about is that the link never changes color and I get
an underline (only) on hover.


So why do you want to make life difficult for your visitors? (Or did you
not appreciate that that is what you are doing?)

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/
May 15 '06 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

5
by: Dan Jacobson | last post by:
What's Nielsen talking about in http://www.useit.com/alertbox/20040503.html http://www.useit.com/alertbox/20040510.html Can't a good browser keep track of visited vs. unvisited link colors? Is my...
3
by: Bart Lateur | last post by:
I want my links to look the same as the surrounding text. Can I do that without explicitely specifying the color to be used? What I'd really want to do, is disable the automatic override in links,...
18
by: Denny Schierz | last post by:
hi, i want to change my link colors in the p class="suchen": That is my html: <?xml version="1.0" encoding="iso-8859-1"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//DE"...
2
by: Al Franz | last post by:
Have a web site which uses a CSS file. There is one link which I would like to change the colors for the A:link, A:visited, and A:hover. Is there something I can put in the HTML code to override...
4
by: Franklin | last post by:
WITHOUT KNOWING ANYTHING ABOUT THE CURRENT COLORS, I want to swap the foreground/background colors of a link when someone hovers over it. Is this possible with HTML, CSS, DOM, & JavaScript? If...
3
by: Woodmon | last post by:
Example of my CSS follows: <style type="text/css" media="screen"> BODY { color: white } A:link { color: 66CCFF; } A:visited { color: CC66FF; } A:active { color: CC66FF; } A:hover {...
7
by: Dave Y | last post by:
I am a newbie to C# and am having trouble trying to override a ListView property method. I have created a new class derived from the Forms.Listview and I cannot figure out the syntax to override...
8
by: Keith Smith | last post by:
Could some one help me a little? I am trying to understand when/where you would ever want to use "protected override..." code such as this. How is this any different from creating a...
2
by: jessicalgaudette | last post by:
I have been asked to change some background colors in a website that use a masterpage. This only effects 6, with each set of 2 using a different stylesheet of the many web pages, but I am having...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.