Question about CSS

[Sonnich Jensen]

Hello

I am not an expert in this, hence the question:

I have code like this:

CSS:
td { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#333333; text-decoration: none; font-size: 12px }
..aa { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#990000; text-decoration: none; font-size: 12px; cursor: hand; }
..aa:hover { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#000066; text-decoration: none; font-size: 12px; cursor: hand; }

and html:
<tr class='aa' ....

problem: the css is a greater part of a project, so I cannot change
all what I want in there.
The "aa" is my idea, it is for a clickable table, which works well -
idea: the entire row should change from red to blue when clicked.

The problem is "color: #333333;" - once I remove that, it works as
requested. So, how do I override that colour code up there?
As I mentioned, I cannot remove it, so I have to override it somehow.
I recall playing with it, and problems, where refreshing was an issue,
IE keeps CSS files beyond history. It has worked once, then I changed
the name... and it did not work any more. I am not sure what I did
back then, but I have not been able to recreate it.

Can anyone help me here?

BR
Sonnich

 

[Jukka K. Korpela]

Scripsit Sonnich Jensen:

I have code like this:

Do you have a URL?

td { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#333333; text-decoration: none; font-size: 12px }
.aa { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#990000; text-decoration: none; font-size: 12px; cursor: hand; }
.aa:hover { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#000066; text-decoration: none; font-size: 12px; cursor: hand; }

That's not just pointlessly verbose. It also has several common symptoms of
misguided design. Please don't make me started.... I'll just mention ".aa"
(no hint about meaning), Verdana, 12px, and setting color without setting
background.

problem: the css is a greater part of a project, so I cannot change
all what I want in there.

Then the person responsible for the project as a whole should tell you how
to work within its general design. What _can_ you change? We have little
possibilities in helping you there, since we don't even know your page's
URL, still less anything about the project as a whole.

The "aa" is my idea, it is for a clickable table, which works well -
idea: the entire row should change from red to blue when clicked.

I don't believe you (I mean the part "works well"). Prove me wrong by
posting a URL.

The problem is "color: #333333;" - once I remove that, it works as
requested. So, how do I override that colour code up there?

You override a color set for a <td> by setting the color property for the

As I mentioned, I cannot remove it, so I have to override it somehow.

Set colors for <td> elements you want to color, not to <tr> elements
containing them. If there were no color setting to <td>, the element would
inherit the color value from its parent (<tr>), but you're telling me there
_is_ a setting and it cannot be removed.

Assuming that the clueless rule

td { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#333333; text-decoration: none; font-size: 12px }

has been carved into stone by a clueless dee-ziner and sanctified by a
pointy-haired boss, so that they are beyond reasonable reconsideration for
now, you could just set

..aa td { color: #990000; cursor: hand; }
..aa:hover td { color: #000066; }

if you really want to do what you are doing. There's no point in repeating
the clueless font settings. (It would involve the risk of preserving those
bad settings for your "clickable rows" even if the overall style sheet of
the project were fixed.)

 

[Beauregard T. Shagnasty]

I have code like this:

CSS:
td { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#333333; text-decoration: none; font-size: 12px }

First, read this: http://k75s.home.att.net/fontsize.html

.aa { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#990000; text-decoration: none; font-size: 12px; cursor: hand; }

You do not have to repeat font settings all the time. Just set it once
on the body. See above link.

.aa:hover { font-family: Verdana, Arial, Helvetica, sans-serif; color:
#000066; text-decoration: none; font-size: 12px; cursor: hand; }

and html:
<tr class='aa' ....

problem: the css is a greater part of a project, ... <snip>
Can anyone help me here?

Please post a test case and give the URL. There could be many factors
involved, not shown in your bit of code.

 

[Jonathan N. Little]

The "aa" is my idea, it is for a clickable table, which works well -
idea: the entire row should change from red to blue when clicked.

In addition to what the others have said, CSS is not programming
language so it really does not have events. If you want change as a
result of a "click" then your solution would require JavaScript. CSS
does have a pseudo-class that blurs the line here by trapping the mouse
hovers and focus events, but is limited to that and support is spotty.
MSIE only supports the :hover pseudo-class on links, A elements with the
HREF attribute. So it would not work on a table cell.

 

[Sonnich Jensen]

In addition to what the others have said, CSS is not programming
language so it really does not have events. If you want change as a
result of a "click" then your solution would require JavaScript. CSS
does have a pseudo-class that blurs the line here by trapping the mouse

I found a solution which meets my need. By moving some stuff to <td> I
found a way. onmouse and onclick are placed in <td> and <tr> and that
does the trick.
Fortunately, I dont have any place to upload a demo.

BR
Sonnich

 

[Beauregard T. Shagnasty]

Fortunately, I dont have any place to upload a demo.

Fortunately? Was that a typo? <lol>

 

[Jonathan N. Little]

I found a solution which meets my need. By moving some stuff to <td> I
found a way. onmouse and onclick are placed in <td> and <tr> and that
does the trick.

onmouseover and onclick would be JavaScript.

Fortunately, I dont have any place to upload a demo.

Don't say that, that is the lamest excuse over used in this NG. Everyone
has the ability to upload a dome somewhere...

1) on the free webspace provided by their ISP with their account
2) a temp folder on the existing website that they are futzing to find a
solution for
3) a free webserver... Google is your friend


Take care,

Jonathan

 

[dorayme]

Fortunately, I dont have any place to upload a demo.

Don't say that, that is the lamest excuse over used in this NG. Everyone
has the ability to upload a dome somewhere...[/QUOTE]

What about if the person is being tied down in desert far from
any phone or cable or anything, surrounded by a moat and a ring
of fire and lions... no... this is too childish. I must not hit
the send button, I must not hit the send button, I must not hit
the send button, I must not hit the send button, I must not hit
the send button, I must not ...

 

[Jonathan N. Little]

Don't say that, that is the lamest excuse over used in this NG. Everyone
has the ability to upload a dome somewhere...

What about if the person is being tied down in desert far from
any phone or cable or anything, surrounded by a moat and a ring
of fire and lions... no... this is too childish. I must not hit
the send button, I must not hit the send button, I must not hit
the send button, I must not hit the send button, I must not hit
the send button, I must not ...
[/QUOTE]

Then a CSS question is very low on their list of priorities

 

[Sonnich Jensen]

Fortunately? Was that a typo? <lol>

You are absolutely right