Question about CSS

Discussion in 'HTML' started by Sonnich Jensen, Sep 12, 2007.

  1. 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
     
    Sonnich Jensen, Sep 12, 2007
    #1
    1. Advertising

  2. 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
    <td> in a style sheet rule that wins the rule you want to override, by the
    CSS cascade mechanism.

    > 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.)

    --
    Jukka K. Korpela ("Yucca")
    http://www.cs.tut.fi/~jkorpela/
     
    Jukka K. Korpela, Sep 12, 2007
    #2
    1. Advertising

  3. Sonnich Jensen wrote:

    > 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.

    --
    -bts
    -Motorcycles defy gravity; cars just suck
     
    Beauregard T. Shagnasty, Sep 12, 2007
    #3
  4. Sonnich Jensen wrote:

    > 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.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Sep 12, 2007
    #4
  5. On Sep 12, 4:37 pm, "Jonathan N. Little" <>
    wrote:
    > Sonnich Jensen wrote:
    > > 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


    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
     
    Sonnich Jensen, Sep 12, 2007
    #5
  6. Sonnich Jensen wrote:

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


    Fortunately? Was that a typo? <lol>

    --
    -bts
    -Motorcycles defy gravity; cars just suck
     
    Beauregard T. Shagnasty, Sep 12, 2007
    #6
  7. Sonnich Jensen wrote:

    > 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
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Sep 13, 2007
    #7
  8. Sonnich Jensen

    dorayme Guest

    In article <b0e29$46e88c96$40cba7b5$>,
    "Jonathan N. Little" <> wrote:

    > > 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...


    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 ...

    --
    dorayme
     
    dorayme, Sep 13, 2007
    #8
  9. dorayme wrote:
    > In article <b0e29$46e88c96$40cba7b5$>,
    > "Jonathan N. Little" <> wrote:
    >
    >>> 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...

    >
    > 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 ...
    >


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

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Sep 13, 2007
    #9
  10. On Sep 12, 8:48 pm, "Beauregard T. Shagnasty"
    <> wrote:
    > SonnichJensen wrote:
    > > Fortunately, I dont have any place to upload a demo.

    >
    > Fortunately? Was that a typo? <lol>


    You are absolutely right
     
    Sonnich Jensen, Sep 13, 2007
    #10
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Eric
    Replies:
    4
    Views:
    781
    clintonG
    Dec 24, 2004
  2. tom watson

    print.css and screen.css

    tom watson, Sep 9, 2003, in forum: HTML
    Replies:
    1
    Views:
    497
    Jukka K. Korpela
    Sep 9, 2003
  3. Replies:
    6
    Views:
    585
    Jonathan N. Little
    Mar 18, 2006
  4. AF
    Replies:
    17
    Views:
    628
    Nije Nego
    Aug 9, 2006
  5. richard
    Replies:
    12
    Views:
    785
    dorayme
    Mar 9, 2010
Loading...

Share This Page